- 浏览: 67899 次
- 性别:
- 来自: 长春
文章分类
最新评论
作者:Klaus Komenda , 翻译:butwho
英文原文:Collection of Web Developer Tools, per Browser
原文发现:译言-Collection of Web Developer Tools for major browsers
中文译文:Web开发工具大集合——每个浏览器都有份的!
网 站开发者的一大苦恼,就是有太多的浏览器要应付。幸亏世界上有一些聪明的人,能够研究出一大些方便编辑和调试网页代码的好工具。不过,要从不计其数的小工 具里面找出合适的可真不容易。这篇文章列出了几个最好用的web开发工具,并指导你快速地激活、安装、使用他们。 下面是工具列表:
Firefox |
|
IE6, IE7 |
|
Opera |
|
Safari |
|
Web Developer Toolbar
Firefox上开发和调试web站点的不二之选。Web developer toolbar包含了一系列工具,从cookie管理到CSS调试,从导航线到屏幕标尺,功能简直是多得说不完。 Web开发工具栏 下载地址:http://chrispederick.com/work/web-developer/
Firebug
萤火虫 是Firefox上数一数二的好扩展,可作为web developer toolbar的补充工具。你可以用Firebug在线检查、监控、编辑网页上的HTML、CSS、JavaScript代码。他还提供一个脚本控制台,让JS编辑编的更简单。控制台对象包含了一大堆选项,允许你输出代码到控制台然后进行调试。Michael Sync提供一个更高级的操作指南,它可以知道你详尽地设置Firebug的选项。另外,Firebug上有一个带宽监视器,能让你清楚地看到某些代码占了多少带宽。 Firebug 下载地址:http://www.getfirebug.com/
Modify Headers
Modify headers是一个可以添加、修改和过滤HTTP请求头的工具。你可以用这个工具冒充成移动设备登陆网站,它甚至可以伪造一个Ajax请求。 Modify Headers 下载地址:http://modifyheaders.mozdev.org/
Poster
你可以通过Poster扩展与Web服务或者其他web资源进行交互,它能让你发送HTTP请求、设置请求实体和内容格式。这可以让你检测Web交互的效果。 Poster下载地址:http://code.google.com/p/poster-extension/
XRAY & MRI
X光和核磁共振成像是可以应用在IE6+、Webkit和Mozilla为基础的浏览器上的bookmarklets(嘛叫Bookmarklets),包括Safari, Firefox, Camino和Mozilla. Xray 能帮你检测盒模型里的每一个元素,MRI可以测试和应用选择器。 XRay下载地址:http://www.westciv.com/xray/index.html MRI下载地址:http://www.westciv.com/mri/
Firefox Accessibility Extension
Mozilla/Firefox无障碍扩展让残疾人士方便地浏览网页内容。开发人员可以用这个扩展检查他们的结构和样式的网页易读性。 Firefox Accessibility Extension下载地址:http://firefox.cita.uiuc.edu/
IE Developer Toolbar
微软的英特网探索者开发工具条是IE上最好的DOM检查和CSS调试工具。由于IE具有高市场占有率而又在整个渲染模型上充满缺陷(比如臭名昭著的hasLayout边距重叠BUG),调试IE是web开发必不可少的步骤——没有这个工具条,IE的调试将会成为一场噩梦。虽然IE Developer Toolbar要比Firebug稍微弱智一点,不过他至少能帮你驯服IE这头怪兽。 IE Developer Toolbar下载地址:http://www.microsoft.com/downlo…aylang=en
Web Accessibility Toolbar
The Web Accessibility Toolbar( href="http://www.paciellogroup.com/resources/wat-about.html">Opera版)可 以检查网站的易读性(当然是可能的易读性,总不能指望电脑能像人一样读网页吧?)此外,这个工具还提供其他功能,比如检查死链接和改变浏览框大小等等。 The Web Accessibility Toolbar下载地址:http://www.visionaustralia.org.au/ais/toolbar/
Visual Web Developer Express Edition
IE开发工具栏木有JavaScript调试功能,你得找个别的工具搞JS。你可以用Microsoft Script Debugger(下面将提到)或者免费下载这个重量级的Visual Web Developer Express Edition。Bernie那儿有这个工具的教程(当 然是英文的),它详尽地告诉你如何用这个工具调试JavaScript代码。 你也可以用Microsoft Script Editor 编辑 JS代码——不幸的是,这并不是个免费工具(在国内,这似乎不是个大问题)。他被捆绑在Office 2003安装包里,而微软又不提供单独下载。正因为如此,这儿就不多提它了。Jonathan Boutelle提供了这个工具的一些教程。
Microsoft Script Debugger
你可以在微软网站上免费下载这个工具,MSDN上也有一个相关文档。这个工具比Visual Web Developer Express Edition弱很多,不过仍然能处理一些IE上那些让人摸不着头脑的提示,诸如“缺乏对象”一类。Jake Howlett 有个《如何使用Microsoft Script Debugger调试JavaScript》的教程。为安全起见,安装脚本调试器之后最好要重新启动一下你的电脑。 Microsoft Script Debugger下载地址:http://www.microsoft.com/do..laylang=en
Opera developer tools
Opera有两个开发工具:Opera 开发控制台(Opera Developer Console)和Dom快照工具(DOM Snapshot)。从截图来看,他们都很有前途。这个工具算是Opera 9以上版本用的bookmarklets。不过我没能让他们在Opera 9.10上成功运作。 Opera开发工具下载地址:http://dev.opera.com/tools/
Opera Error Console
错误控制台是Opera的一个内置功能,可以在工具-高级-错误控制台中激活这个它。它能弹窗显示当前网页上的错误或者警告信息,或者你可以过滤某种类型的信息,比如HTML、CSS、XML或者Javascript警告。你可以在opera网站找到错误控制台的详细教程。
Safari Debug Menu
Safari的debug能力很弱,但至少显示一个Javascript控制台能让Javascript调试变得简单点儿(这与Firebug和Opera错误控制台类似)。在Apple网站的开发部门,有一个常见问题文档说明如何启用隐藏的调试菜单。 在Mac OS X下,打开一个终端然后输入:
defaults write com.apple.Safari IncludeDebugMenu 1
在
windows下,用文本编辑器打开Preferences.plist,这个文件的位置往往是C:Documents and
SettingsUSERNAMEApplication DataApple
ComputerSafariPreferences.plist,在文件最后添加: <key>IncludeDebugMenu</key> <true/>
在Safari 1.3及以上版本,你可以进入Debug菜单然后钩选“记录Javascript意外”的选项。然后选择“显示JavaScript Console”。这就可以用控制台记录Javascript错误。
Web Inspector
要在Mac OS上激活Safari Web Inspector (Safari 3及以上可用),打开终端窗口然后输入
defaults write com.apple.Safari WebKitDeveloperExtras -bool true
在windows中,打开Documents and Settings*你的用户名*Application DataApple ComputerSafariWebKitPreferences.plist,添加以下内容:
<key>WebKitDeveloperExtras</key>
<true/>
然后退出Safari并重新打开,你将在菜单中看到一个“检查元素”选项,就是它了!
**知识扩充:嘛叫bookmarklets?
具体说来,俺也不大清楚,新名词啊?在这儿找到一个解释:
所 謂的Bookmarklet,簡單的說,就是一個內含簡單 JavaScript程式碼的書籤。使用的方法和書籤一樣,不同的地方是:書籤是用來記錄瀏覽的位置,而bookmarklet則是記錄某些程序或是方 法。 另一方面,bookmarklet在本質上可說是將JavaScript語言類比為一通訊協定(protocol),就像http或是ftp一樣,並需要 透過瀏覽器來進行解譯,因此,bookmarklet必需依靠瀏覽器才能發揮功用。
好像说,Greasemonkey之类的玩意儿就跟bookmarklet相关?
原文:http://www.weborn.org/collection-of-web-developer-tools-per-browser-466/
发表评论
-
情绪不是反应,而是决定
2011-04-06 16:58 694http://www.cnblogs.com/kuaidian ... -
转帖: 老板评价下属的普遍性原则
2010-04-15 16:02 757转帖自:阿里巴巴(软件)开发者博客 差 ... -
struts2 自定义类型转换器
2009-11-25 11:17 768参考地址: 1.忘记李刚,一步一步跟我学Struts2 —— ... -
META-INF文件夹中的MANIFEST.MF 作用
2009-11-23 10:09 1597转自:http://www.blogjava.net/siyn ... -
感触很深的文章:三五个人十来条枪 如何走出软件作坊成为开发正规军(未完,持续关注中)[更新2]
2008-07-03 10:11 805感触很深的文章,特转 ... -
Java Options
2009-03-05 15:18 995摘自:http://blog.csdn.net/dingxy/ ... -
[转载]软件测试术语
2009-03-23 13:28 765转自:http://blog.csdn.net/scm ... -
java写大数据到 excel文件
2009-07-11 23:21 972来自:javaeye网站biguan ... -
sun被Oracle收购啦
2009-04-20 21:10 872http://www.sun.com/aboutsun/med ... -
感触很深的文章:三五个人十来条枪 如何走出软件作坊成为开发正规军(未完,持续关注中)[更新2]
2008-07-03 10:11 819感触很深的文章,特转 ...
相关推荐
深入体验Java Web开发内幕——核心基础 深入体验Java Web开发内幕——核心基础
WEB数据库开发工具——WEB.SQL及其应用.pdf
Web网页设计期末大作业——壁纸之家网站源码(纯手打,高分项目)Web网页设计期末大作业——壁纸之家网站源码(纯手打,高分项目)Web网页设计期末大作业——壁纸之家网站源码(纯手打,高分项目)Web网页设计期末大...
PHP MySQL——开发Web数据库的实用工具.pdf
Web开发的平民英雄——PHP+MySQL,网上很多pdf版本,但是没有源代码,我这里献上
在充分利用网络的即时性、互动性方面,Web数据库起着重要的作用,于是很多网站开始重视Web数据库的开发。Web数据库的主要目的就是存储信息,一般是通过前台页面与浏览者的交互收集信息,然后结合前台的程序(一般为...
《Web开发敏捷之道——应用Rails进行敏捷Web开发,第2版》书籍配套代码(zip) 资源很少的哦
Web程序设计——ASP.NET网站开发——PPT+Web程序设计——ASP.NET网站开发——源代码
360快速浏览器,web开发调试工具,chrome动态调试运行中的js对象
《Delphi Web前端开发教程——基于TMS WEB Core框架》PDF本教程适合对使用Delphi TMS WEB Core 创建 Web 应用程序感兴趣的初学者和高级开发人员。学习本教程只需要免费的 Delphi 社区版以及 TMS WEB Core 的试用版就...
超棒的web应用技术课程设计——在线影评系统.pdf超棒的web应用技术课程设计——在线影评系统.pdf超棒的web应用技术课程设计——在线影评系统.pdf超棒的web应用技术课程设计——在线影评系统.pdf超棒的web应用技术...
django 学习笔记(1)—— python和web开发框架(csdn)————程序
超棒的web应用技术课程设计——在线影评系统.docx超棒的web应用技术课程设计——在线影评系统.docx超棒的web应用技术课程设计——在线影评系统.docx超棒的web应用技术课程设计——在线影评系统.docx超棒的web应用...
开发备必——WEB前端开发规范文档
Java Web开发实践教程——从设计到实现(第2版)(2013年)一书的PPT。
详细功能介绍及使用说明见博文:web服务器测试工具Gulu——HTTP接口测试工具 (已完成) 2. 分布式进程管理:a. 支持远程进程执行及指定用户的远程进程
《Web前端设计基础——HTML5、CSS3、JavaScript》张树明版前十章课后习题答案
Web开发入门经典——使用PHP6、Apache和MySQL.rar
《Java Web开发基础——从Servlet到JSP》源代码v1.0