石锅拌饭

Tag: extension

Firebug中你不该错过的几个功能

by on Sep.10, 2007, under Uncategorized

Firebug是Firefox的一个扩展,提供了诸多网页开发的辅助功能,如果你是一个网页开发人员,天天要和HTML/CSS/Javascript打交道,Firebug能大大提高你的工作效率。
Firebug的大部分功能都很直观,我最常使用的是Inspect CSS/DOM和Javascript debug,有时候会看看Net和YSlow。还有一些功能,或大或小,不是上来就发现,但也是非常好用,不容错过:

获取XPATH

无论做userscriptbookmarklet还是网页爬虫,有时候用五六行DOM实现的网页元素提取,用XPath一句就搞定了。以前定位一个元素的XPath主要靠眼,有Firebug就省眼了,先用Inspect定位网页元素,然后点右键,选Copy XPath,搞定。
拷贝xpath
这个XPath是从DOM树里来的,已经修正了网页上的一些错误,所以有时和实际的XPath有一些偏差,但一般都很容易调整。比如一些网页中table里没有tbody,直接就是表格内容,DOM树会自动补上tbody,得到的xpath中也会有tbody,在实际使用的时候,和网页实际内容对应,就要把tbody去掉。

javascript命令行

如果哪个脚本语言不提供带命令行的控制台(console),我就不玩了,:-p。善用命令行控制台(console),可以省下很多debug的时间。我以前介绍过jsenv。Firebug也提供非常好用的javascript命令行控制台,可以直接和当前网页交互,输入命令的时候还能自动补齐。另外,一定不要忘记先看看这个命令列表

控制台API

我最爱用的javascript函数就是alert,偶尔把它放在循环里,我可以花一下午的时间点OK玩。现在是和alert说byebye的时间了。Firebug提供了一套相当完备的javascript控制台API,可以将log直接输出到控制台而不再用跳出小窗口,提供多种log级别(debug,info,warn,error)和分组功能,可以显示对象属性,可以记录stack trace,甚至提供timer和profiler,调试performance都不用发愁了。记得查看控制台API的说明

标尺

无论在网页布局还是做动态HTML,常常需要知道一个网页元素的相对位置。你可以装一个Measueit扩展自己量,也可以用Firebug里的标尺。用Inspector选中你要度量的元素,在右侧选中Layout标签,然后鼠标划过盒模型中央,标尺就会出现。
Firebugruler

在所有浏览器中使用Firebug

对不起,不是所有的功能,是不是有点失望。不过,至少你可以保证控制台API正常输出,并且提供命令行的支持,已经相当不错了。下载firebuglite文件,放在脚本目录下,然后在页面中加入:

<script language="javascript" type="text/javascript"
src="/path/to/firebug/firebug.js"></script>

用F12就可以召唤出Firebug了。

3 Comments :, , , , , , more...

豆瓣工具条

by on May.12, 2006, under Uncategorized

为Firefox做了一个简单的douban工具条,可以方便的在豆瓣中搜索图书电影唱片。不知道是不是有人已经做过。
doubanbar for firefox
本想加入一个方便建立豆列的功能,但最近是在太忙了,不知道什么时候有时间。

5 Comments :, , , more...

Firefox的Blog编辑扩展Performancing

by on Dec.21, 2005, under Uncategorized

Performancing.com出了一个Firefox的插件-Performancing for Firefox。这个扩展提供Blog编辑和发布的功能,有rich editing、分类和修改已发布的blog的功能,支持WordPress、MovableType和Blogger等等Blog系统。如果你还在忍受每次登录到网站上发布blog,可以试试这个扩展。支持Firefox 1.5以上版本。

Comments Off on Firefox的Blog编辑扩展Performancing :, , more...

IE Tab

by on Dec.03, 2005, under Uncategorized

台湾的Firefox爱好者做了一个叫IE Tab的扩展,可以在Firefox中打开一个Tab,在这个Tab中使用IE来显示页面。
他的实现很巧妙,将IE控件以plugin的形式封装起来,通过修改mime type触发网页在这个plugin中显示。通常的思路是重载Gecko中的nsIWebBrowser接口,那样做就复杂多了。用plugin来实现,不但大大简化了接口,更方便了安装。当然,非Windows平台的用户就无法使用这个扩展了。

Comments Off on IE Tab :, , more...

Search

Archives

Browse by tags

agile apple blog book design ecto extension firefox git google hack ichm iphone keyword life mac madfox movie nonsense opensource plugin pm ruby rubyonrails sns software startup wordpress work 财帮子