`
flex_莫冲
  • 浏览: 1091872 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

Console API 当打开 firebug (也包括 Chrome 等浏览器的自带调试工具),window 下面会注册一个叫做 console 的对象,它

 
阅读更多
Console API

当打开 firebug (也包括 Chrome 等浏览器的自带调试工具),window 下面会注册一个叫做 console 的对象,它提供多种方法向控制台输出信息,供开发人员调试使用。下面是这些方法的一个简单介绍,适时地运用它们,对于提高开发效率很有帮助。
console.log(object[, object, ...])

使用频率最高的一条语句:向控制台输出一条消息。支持 C 语言 printf 式的格式化输出。当然,也可以不使用格式化输出来达到同样的目的。下面两行代码执行的结果是相同的:

console.log("The %s jumped over %d tall buildings", animal, count);
console.log("The", animal, "jumped over", count, "tall buildings");

console.debug(object[, object, ...])

向控制台输出一条信息,它包括一个指向该行代码位置的超链接。
console.info(object[, object, ...])

向控制台输出一条信息,该信息包含一个表示“信息”的图标,和指向该行代码位置的超链接。
console.warn(object[, object, ...])

同 info。区别是图标与样式不同。
console.error(object[, object, ...])

同 info。区别是图标与样式不同。error 实际上和 throw new Error() 产生的效果相同,使用该语句时会向浏览器抛出一个 js 异常。
console.assert(expression[, object, ...])

断言,测试一条表达式是否为真,不为真时将抛出异常(断言失败)。
console.dir(object)

输出一个对象的全部属性(输出结果类似于 DOM 面板中的样式)。
console.dirxml(node)

输出一个 HTML 或者 XML 元素的结构树,点击结构树上面的节点进入到 HTML 面板。
console.trace()

输出 Javascript 执行时的堆栈追踪。
console.group(object[, object, ...])

输出消息的同时打开一个嵌套块,用以缩进输出的内容。调用 console.groupEnd() 用以结束这个块的输出。
console.groupCollapsed()

同 console.group(); 区别在于嵌套块默认是收起的。
console.time(name)

计时器,当调用 console.timeEnd(name);并传递相同的 name 为参数时,计时停止,并输出执行两条语句之间代码所消耗的时间(毫秒)。
console.profile([title])

与 profileEnd() 结合使用,用来做性能测试,与 console 面板上 profile 按钮的功能完全相同。
console.count([title])

输出该行代码被执行的次数,参数 title 将在输出时作为输出结果的前缀使用。
console.clear()

清空控制台
命令行

控制台的输出面板右边,是控制台的输入面板(Chrome 调试工具对应为下方),在这里除了可以运行常规的 javascript 代码,还内置了相当数量的命令行可以辅助我们的调试工作,下面是一些常用命令行的简单介绍:
$(id)

返回一个给定 id 的元素。
$$(selector)

返回给定的 css 选择器匹配到的一组元素。
$x(xpath)

返回给定的 XPath 表达式匹配到的一组元素。
$0

在 HTML 面板中选中的元素。
$1

上一次在 HTML 面板中选中的元素。
$n(index)

访问最近 5 个被选中过的元素,index 的范围: 0 - 4。
dir(object)

同 console.dir(object)。
dirxml(node)

同 console.dirxml(node)。
clear()

同 console.clear()。
inspect(object[, tabName])()

在合适的(或一个指定的) tab 中检视一个对象。
keys(object)

返回一个对象的所有属性的键。
values(object)

返回一个对象的所有属性的值。
debug(fn)

在函数第一行添加一个断点,使用 undebug(fn) 移除断点。
monitor(fn)

开启一个函数的调用日志,使用 unmonitor(fn) 关闭该功能。非常有用的一个命令,但是它似乎并没有很好地工作。
monitorEvents(object[, types])

开启一个元素的某个事件(或所有事件)被触发时的日志记录。用例如下:

monitorEvents($0,['click'])

上面的命令行被执行后,将开启当前在 HTML 面板中被选中元素的 click 事件监控,一旦这个元素的 click 事件被触发,事件对象将会在控制台输出。如果不指定第二个参数,将对所有事件进行记录。
profile([title])

同 console.profile([title])
参考资料

    Firebug wiki --- Command Line API
    Firebug wiki --- Console API
来源:http://suliuyes.iteye.com/blog/1071388
分享到:
评论

相关推荐

    FireBug浏览器调试工具

    Firebug 是网页浏览器 Mozilla Firefox 下的一款开发类插件,现属于Firefox的五星级强力推荐插件之一。它集HTML查看和编辑、Javascript控制台、网络状况监视器于一体,是开发JavaScript、CSS、HTML和Ajax的得力助手...

    Firebug_Console命令行全集.pdf

    Firebug是Mozilla开发的一款用于网页代码调试的工具,它被集成在Firefox浏览器中。Console是Firebug中的一个功能强大的调试面板,允许开发者在浏览器控制台查看信息、执行JavaScript语句和命令,以及监控和分析页面...

    javascript调试工具firebug-1.4.0b4

    "javascript调试工具firebug-1.4.0b4"这个标题指出我们讨论的是Firebug的一个特定版本——1.4.0b4,它在当时是一个重要的更新。 Firebug的JavaScript调试功能非常全面,它允许开发者在代码中设置断点,逐行执行代码...

    firebug插件及各种浏览器

    Firebug是一款曾经非常流行的JavaScript调试工具,尤其在Web开发领域有着广泛的应用。这款插件最初是为Firefox浏览器设计的,它允许开发者深入洞察网页的HTML、CSS以及JavaScript代码,从而实现对页面元素的查看和...

    firebug,javascript调试

    Firebug是一款强大的网页调试工具,主要用于Firefox浏览器,虽然现在支持更多浏览器版本,但最初它专门为Firefox设计。它集成了多个功能模块,包括HTML检查器、CSS样式编辑器、网络请求分析器、脚本调试器等,帮助...

    JavaScript css浏览器的调试

    - 打开IE6或IE7浏览器,选择工具 -> Internet选项 -> 高级 -> 浏览,取消“禁止脚本调试”的两个选项。 - **调试脚本步骤** - **第一步**:打开需要调试的页面,通过查看 -> 脚本调试程序 -> 打开来激活调试模式...

    火狐调试工具firebug

    火狐调试工具Firebug是一款强大的Web开发和调试插件,它为Firefox浏览器提供了直观的界面,使得开发者可以方便地查看和操作HTML、CSS、JavaScript以及网络请求等元素。Firebug的功能强大,对于前端开发者来说是不可...

    safari浏览器的firebug

    为了弥补这一空白,开发者社区推出了一款名为Firebug Lite的插件,它是Firebug的一个轻量级版本,专门为不支持原生Firebug的浏览器设计,包括Safari。 在Safari中安装Firebug Lite,你需要下载`firebuglite....

    php浏览器模式调试toolbar firefox chrome ie

    IE的开发者工具可以通过F12快捷键打开,提供了类似于Firefox和Chrome的调试功能,包括DOM查看、网络请求和脚本调试。对于PHP调试,由于IE本身并不支持Xdebug的直接集成,你需要依赖第三方工具,如Visual Studio或...

    Firebug调试工具及使用注意事项等相关文档

    Firebug是一款强大的Web开发与调试工具,它专为Firefox浏览器设计,允许开发者深入查看和修改HTML、CSS、JavaScript以及DOM。这款工具对于前端开发者来说,是进行网页优化、错误排查和性能测试的重要辅助手段。 一...

    火狐+firebug调试工具

    Firebug是火狐浏览器的一个重要插件,它为开发者提供了强大的网页前端开发和调试工具,极大地提升了网页开发的效率。Firebug的功能包括HTML、CSS、JavaScript的实时编辑和调试,以及对网络请求的监控,是前端开发...

    FireBug Web 开发调试工具

    【FireBug Web 开发调试工具】是专门为前端开发者设计的一款强大插件,它与Firefox浏览器紧密结合,为Web应用程序的开发和调试提供了前所未有的便利。FireBug对于基于浏览器的(Browser-Side,即BS架构)开发尤其...

    firebug1.45调试javascript工具

    Firebug 1.45是JavaScript开发者的一个重要工具,它为网页开发人员提供了一套集成在Firefox浏览器中的强大调试功能。这款插件在当时是非常流行的,尤其对于JavaScript的调试、性能分析以及HTML和CSS的调整来说,都是...

    IE6下调试工具-js写的高仿firebug

    在互联网发展的早期,Internet Explorer 6(简称IE6)曾是主流浏览器之一,但它的开发工具功能相对匮乏,尤其在JavaScript(js)调试方面。针对这一问题,开发者们创造了一个名为"IE6下调试工具-js写的高仿firebug...

    firebug调试技巧

    Firebug是一款功能强大的调试工具,它不仅能够帮助开发者快速定位和解决JavaScript错误,还提供了丰富的日志输出选项和交互式代码执行功能。通过深入了解和灵活运用这些特性,开发者可以显著提升调试效率,从而更快...

    Firebug 火狐调试器

    **火狐调试器——Firebug**,作为一款在JavaScript开发者中广为人知的工具,它在Web开发领域扮演着至关重要的角色。Firebug是Mozilla Firefox浏览器的一个插件,专为前端开发者提供强大的JavaScript调试功能,使得对...

    FireFox调试工具:FireBug加对应版本FireFox

    标题中的“FireFox调试工具:FireBug加对应版本FireFox”指的是Firefox浏览器的一款强大的开发者工具——FireBug,以及它与特定版本Firefox的搭配使用。FireBug是早期Web开发人员广泛使用的浏览器扩展,它提供了对...

    类似firebug的IE调试工具包

    1.打开IE菜单“工具”--“Internet选项”--“高级”,找到“禁用脚本调试(Internet Explorer)”和“禁用脚本调试(在Internet Explorer之外)”,将两个选项前面的对钩都去掉,然后重启IE。 2.在Ie中输入:...

    firebox浏览器+firebug-1.5

    标题中的“firebox浏览器+firebug-1.5”指的是Firefox浏览器的一个早期版本,搭配了Firebug插件的1.5版本。Firefox是一款开源的网络浏览器,以其高度可定制性和强大的开发者工具而闻名。Firebug是Firefox的一个经典...

    类似firebug的IE下的工具

    同时,随着现代浏览器的普及,如Chrome和Firefox,它们内置的开发者工具也日益强大,许多开发者已经开始转向这些现代浏览器进行调试,以享受更先进、更丰富的功能。然而,对于仍在维护旧项目的开发者而言,了解和...

Global site tag (gtag.js) - Google Analytics