【实用】10个帮助你精通Firebug控制台的技巧

分享给大家一些jQuery4u撰写的firebug控制台实用技巧,帮助你真正了解并且掌握Firebug控制台。

如果你不知道什么是firebug,那么GBin1建议你查看这篇文章: 主流浏览器中常用的Javascript开发Debug工具,这篇文章我们介绍了什么是Firebug并且如何配置和安装。

技巧1:隐藏烦人的错误

firebug有一些选项可以帮助你隐藏那些烦人的错误信息!(你有可能看到这些错误如果你的代理服务器配置信息过期了,如果你在上班那么和你管理员查验一下是否使用正确的.pac文件)。这些选项也可以帮助你隐藏其它类型的错误!

【实用】10个帮助你精通Firebug控制台的技巧

技巧2:快捷键的使用

使用快捷键而非直接点击”RUN“按钮可以帮助你方便快捷的”运行“,这样效率更高!

技巧3:Firebug控制台表格

创建一个firebug控制台表格 - 简单的拷贝如下代码来看看效果吧!

var table1 = new Array(5);

for(vari=0;i<table1.length;i++)


table1[i]=[i+1,i+2,i+3,i+4,i+5,i+6,i+7];


console.table(table1);

技巧4: Console.dir()

使用console.dir()而非console.log()的好处在于对于对象,数组及其其它类型,它将直接得显示,这样比较节约时间。你可以简单的输入 dir(对象的名字)  到firebug控制台。 我非常喜欢这个功能。

【实用】10个帮助你精通Firebug控制台的技巧

注意Dir可以没有控制台工作,而log则不行

JQUERY4U = {

url:'http://www.jquery4u.com',


mainTopics:'jquery,javascript'


}


dir(JQUERY4U);//workswithoutconsole.

log(JQUERY4U); //doesn't

技巧5:Console.debug()

使用Console.debug()而非console.log()的好处在于在debug你的js代码时它丢掉了很多让你很烦的垃圾信息。对于经常使用的人来说特别有用。

技巧6:创建书签

你可以使用firebug控制台来快速的创建代码书签。简单的按下:拷贝 > 右键点击书签条 > 点击粘贴。搞定!。现在你随时需要的时候可以点击那个书签来运行代码,甚至为了测试目的。

技巧7:使用Firebug的网络面板

使用网络面板可以帮助大家了解Ajax底层运行的过程和方式,这个是javascript开发中必备的工具

【实用】10个帮助你精通Firebug控制台的技巧

技巧8: Firebug的”add ons"和扩展

这里有很多的firebug扩展和功能项,如果你使用jQuery,不要错过firequery

GBin1分享:Firebug最佳jQuery开发伴侣Firequery

10 Extension Plugins to Extend the Firebug Console

技巧9: Firebug控制台API

如果你不了解什么是Firebug Console API那么你应该查看一下这里:Firebug Console API

【实用】10个帮助你精通Firebug控制台的技巧

技巧10: DOM CSS 样式校验

在Firebug中,你可以很简单的校验任何元素的样式。简单右键单击并且检验元素,然后转到CSS标签页上。在CSS标签页,任何被删除线覆盖的样式意味着已经被另外的样式覆盖了。记住样式有如下的继承顺序: 1)行内(直接写在html代码中)2)页面内 3)样式表。你可以通过双击标签页内样式实时的编辑样式表,用来创建新的样式。非常酷吧!

【实用】10个帮助你精通Firebug控制台的技巧

(转载请注明出处:[url=http://www.k8764.com]博彩通[/url][url=http://www.5sfd.com]e世博[/url])

相关推荐