使用Firebug

Firefox的插件Firebug对于开发调试网页实在太有帮助了。用F12就可以激活Firebug，默认在网页下端显示。我常用control + F12在新窗口中打开Firebug，这样在左边的主显示器上显示网页，在右边的副显示器上显示Firebug的窗口。这样在使用inspect功能时可以很方便的看到对应元素的代码。查看更多Firebug的快捷键。

在使用console功能时，如果选中了larger command line，Firebug为输入javascript提供的类似vim中设置选项一样的自动补全功能不可用。当在javascript的console提示符>>>后复制一段javascript代码时，larger command line会自动被激活。

在Firebug功能选择的上面一行选中一个元素，右键可以激活Log Events选项。这样可以在console查看事件输出。

有了Firebug不用去W3C查看CSS中的box model了。选中html，选定元素，再选中右边的Layout tab，就可以看到元素的box布局了。

当Firefox加载的网页包含多个frames时，Firebug默认的context是top-level的页面，如何切换context到其中的一个frame呢？

答案：

cd(window)

By default, command line expressions are relative to the top-level window of the page. cd() allows you to use the window of a frame in the page instead.

在command line下的常用函数：

$(id)
Returns a single element with the given id.

$$(selector)
Returns an array of elements that match the given CSS selector.

$x(xpath)
Returns an array of elements that match the given XPath expression.

用于输出日志的函数：

console.debug("message" [,objects]) - Logs a debug message.
console.info("message" [,objects]) - Logs an informative message.
console.warn("message" [,objects]) - Logs a warning.
console.error("message" [,objects]) - Logs an error.