WEB开发之调试利器—Firebug应用全介绍

2010-02-25 16:37:13 作者：网友来源：互联网

8.Javascript调试器

这是一个很不错的javascript脚本调试器，占用空间不大，但是单步调试、设置断点、变量查看窗口一个不少。正所谓麻雀虽小，五脏俱全。

如果你有一个网站已经建成，然而它的javascript有性能上的问题或者不是太完美，可以通过面板上的Profile来统计每段脚本运行的时间，查看到底是哪些语句执行时间过长，一步步排除问题。

图7：javascript调试器

9.DOM查看器

DOM(Document Object Model)里头包含了大量的Object以及函数、事件，在从前，你要想从中查到需要的内容，绝非易事，这好比你去了一个巨大的图书馆，想要找到几本名字不太确切的小书，众多的选择会让你无所适从。而使用Firebug的DOM查看器却能方便地浏览DOM的内部结构，帮助你快速定位DOM对象。双击一个DOM对象，就能够编辑它的变量或值，编辑的同时，你可能会发现它还有自动完成功能，当你输入document.get之后，按下tab键就能补齐为document.getElementById，非常方便。如果你认为补齐得不够理想，按下shift+tab又会恢复原状。用了Firebug的DOM查看器，你的javascript从此找到了驱使的对象，Web开发也许就成了一件乐事。

图8: Dom查看器

10.小结

Firebug插件提供了一整套web开发所必需的工具。从HTML的编写，到CSS样式表的美化调优，以及用javascript脚本开发，亦或是Ajax应用，Firebug插件都会成为你的得力助手。所谓工欲善其事，必先利其器。在Web2.0的时代，言必称Ajax，动辄就是用户体验提升，如果把Firebug工具用好，必能让你如虎添翼，将HTML、CSS、javascript整理得服服帖帖，从此成为web开发中的专家级人物。

11.Firebug教程

教程是英文版的，讲得比较详细，如果E文可以的话，不妨去学习一下！

12.附注

Firebug的中文含义是萤火虫，作者是Joe Hewitt，官方网页 http://www.getfirebug.com
Firefox亦即火狐浏览器，是近年来撼动IE浏览器市场占有率的一支强大力量，要不是它的出现，我想有生之年说不定也看不到IE 7的发布了，官方网页 http://www.firefox.com

相关热词：Firebug Firefox插件网页调试工具

分享到：

更多...

收藏至我的帐号

教程排行榜: QQ、淘宝、MSN、Skype在线状态代码生成方法; 四个免费的在线LOGO和徽章生成工具; 分享三款免费的在线字体设计工具; 十五个免费在线制作网站标志的工具; IE调试工具：Microsoft SuperPreview for IE(附下载); 18款Wordpress最佳的免费幻灯片画廊插件推荐; 解决eWebEditor编辑器在IE8中不能正常使用的方法; 四款可以整合到网站的网页版即时通信IM插件系统; 国外五款主流的免费网站流量统计工具; 三款字体辨认、查找、生成的免费在线字体应...; 21个可用于网站和博客的免费视频播放器插件; 实用的网站Web表单(包括WordPress插件)在线创建工具; 利用google翻译器制作多语种网站; 十七款用于Chrome的网页设计开发工具扩展; 六款网址代推、收藏与分享按钮工具推荐; WEB开发之调试利器—Firebug应用全介绍

下载排行榜: 基于jQuery的超炫酷的3D切换JS幻灯焦点图特效代码; 半透明立体质感的宽屏flash+xml焦点幻灯代码; 简洁效果多图切换flash幻灯焦点图代码; 带标题和数字导航的JS焦点幻灯特效代码; 适合摄影网站超漂亮的宽屏flash+xml幻灯轮换代码; 31款简单实用的CSS+JS下拉菜单脚本; 3D立体效果金字塔环形旋转的flash+xml相册代码; 基于jQuery实现的瀑布流布局列表特效代码; 透明质感上下滑动带小图预览5屏JS焦点图幻...; 超酷的3D摩天轮flash+xml相册幻灯图片代码; 自带多种幻灯效果支持缩略图导航的jquery画...; 能沿多个方向滑动切换的jquery幻灯代码; 可改图片尺寸和张数的flash幻灯轮换代码; 很好看的带缓冲效果CSS下拉菜单导航代码; 基于jquery很有趣的360度全景图片预览特效; 6屏幻灯上下滑动式带缩略图和文字介绍的fla...