FireBug 控制台函数说明

Firebug控制台深度解析与调试实战 Firebug 是一款专为前端开发者打造的调试利器,最初作为 Firefox 浏览器的扩展而广受好评。它集成了 HTML、CSS、JavaScript 的实时调试与分析功能,极大地提升了网页开发与调试的效率。 阅读详情
原文地址: http://www.joehewitt.com/software/firebug/docs.php

FireBug 是一个非常实用的JavaScript以及DOM查看调试工具,是 Firefox 的一个插件。使用 FireBug 调试 AJAX 应用非常方便,终于可以告别 alert 时代了!

Console Logging 函数

FireBug 为所有 Web 页面提供了一个 console 对象。这个对象有以下函数:

Logging 基础

console.log("message" [,objects]) - 将一个字符串打印到控制台。字符串可以包含任何“String Formatting”小节描述的模式。字符串后面的对象应该用来取代之前字符串中的模式。(译者注:大家用过C里面 printf 吧,效果基本是一样的。)

Logging 等级

通常根据不同的等级来区分Logging的严重程度是很有帮助的。FireBug 提供了4个等级。为了达到视觉分离的效果,这些函数与 log 不同的地方就是它们在被调用的时候会自动包含一个指向代码行数的链接。

console.debug("message" [,objects]) - 记录一个 debug 消息。
console.info("message" [,objects]) - 记录一个信息.
console.warn("message" [,objects]) - 记录一个警告.
console.error("message" [,objects]) - 记录一个错误.

断言

断言是一条确保代码规则的非常好的途径。console 对象包含了一系列各种类型的断言函数,并且允许你编写自己的断言函数。

console.assert(a, "message" [,objects]) - Asserts that an a is true.
console.assertEquals(a, b, "message" [,objects]) - Asserts that a is equal to b.
console.assertNotEquals(a, b, "message" [,objects]) - Asserts that a is not equal to b.
console.assertGreater(a, b, "message" [,objects]) - Asserts that a is greater than b.
console.assertNotGreater(a, b, "message" [,objects]) - Asserts that a is not greater than b.
console.assertLess(a, b, "message" [,objects]) - Asserts that a is less than b.
console.assertNotLess(a, b, "message" [,objects]) - Asserts that a is not less than b.
console.assertContains(a, b, "message" [,objects]) - Asserts that a is in the array b.
console.assertNotContains(a, b, "message" [,objects]) - Asserts that a is not in the array b.
console.assertTrue(a, "message" [,objects]) - Asserts that a is equal to true.
console.assertFalse(a, "message" [,objects]) - Asserts that a is equal to false.
console.assertNull(a, "message" [,objects]) - Asserts that a is equal to null.
console.assertNotNull(a, "message" [,objects]) - Asserts that a is not equal to null.
console.assertUndefined(a, "message" [,objects]) - Asserts that a is equal to undefined.
console.assertNotUndefined(a, "message" [,objects]) - Asserts that a is not equal to undefined.
console.assertInstanceOf(a, b, "message" [,objects]) - Asserts that a is an instance of type b.
console.assertNotInstanceOf(a, b, "message" [,objects]) - Asserts that a is not an instance of type b.
console.assertTypeOf(a, b, "message" [,objects]) - Asserts that the type of a is equal to the string b.
console.assertNotTypeOf(a, b, "message" [,objects]) - Asserts that the type of a is not equal to the string b.

测量(Measurement)

下面的一些函数可以让你方便的测量你的一些代码。

console.trace() - 记录执行点的堆栈信息。
console.time("name") - 根据 name 创建一个唯一的计时器。
console.timeEnd("name") - 根据 name 停止计时器,并且记录消耗的时间,以毫秒为单位。
console.count("name") - 记录该行代码执行的次数。

字符串格式化

所有 console 的 logging 函数都可以通过以下模式格式化字符串:

%s - 将对象格式化为字符串。
%d, %i, %l, %f - 将对象格式化为数字。
%o - 将对象格式化成一个指向 inspector 的超链接。
%1.o, %2.0, etc.. - 将对象格式化成包含自己属性的可交互的表格。
%.o - 将对象格式化成具有自身属性的一个数组。
%x - 将对象格式化成一个可交互的 XML 树形结构。
%1.x, %2.x, etc.. - 将对象格式化成一个可交互的 XML 数型结构,并且展开 n 层节点。

如果你需要一个真实的 % 符号,你可以通过一个转移符号就像这样 "/%"。

命令行函数

内建的命令行函数可以通过以下命令行使用:

$("id") - document.getElementById() 的简写。(译者注:跟 prototype.js 学来的吧?)
$$("css") - 返回一个符合 CSS 选择器的元素数组。
$x("xpath") - 返回一个符合 XPath 选择器的元素数组。
$0 - 返回最近被检查(inspected)的对象。
$1 - 返回最近被检查(inspected)的下一个对象。
$n(5) - 返回最近被检查的第n个对象。
inspect(object) - 将对象显示在 Inspector 中。
dir(object) - 返回一个对象的属性名数组。(译者注:跟 Python 学的?)
clear() - 清除控制台信息。

4 Responses to “FireBug 控制台函数说明”

 ---------------------------------------------------------------------

Firebug adds a global variable named "console" to all web pages loaded in Firefox. This object contains many methods that allow you to write to the Firebug console to expose information that is flowing through your scripts.

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

Writes a message to the console. You may pass as many arguments as you'd like, and they will be joined together in a space-delimited line.

The first argument to log may be a string containing printf-like string substitution patterns. For example:

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

The example above can be re-written without string substitution to achieve the same result:

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

These two techniques can be combined. If you use string substitution but provide more arguments than there are substitution patterns, the remaining arguments will be appended in a space-delimited line, like so:

console.log("I am %s and I have:", myName, thing1, thing2, thing3);

If objects are logged, they will be written not as static text, but as interactive hyperlinks that can be clicked to inspect the object in Firebug's HTML, CSS, Script, or DOM tabs. You may also use the %o pattern to substitute a hyperlink in a string.

Here is the complete set of patterns that you may use for string substitution:

String Substitution Patterns
%sString
%d, %iInteger (numeric formatting is not yet supported)
%fFloating point number (numeric formatting is not yet supported)
%oObject hyperlink

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

Writes a message to the console, including a hyperlink to the line where it was called.

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

Writes a message to the console with the visual "info" icon and color coding and a hyperlink to the line where it was called.

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

Writes a message to the console with the visual "warning" icon and color coding and a hyperlink to the line where it was called.

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

Writes a message to the console with the visual "error" icon and color coding and a hyperlink to the line where it was called.

console.assert(expression[, object, ...])

Tests that an expression is true. If not, it will write a message to the console and throw an exception.

console.dir(object)

Prints an interactive listing of all properties of the object. This looks identical to the view that you would see in the DOM tab.

console.dirxml(node)

Prints the XML source tree of an HTML or XML element. This looks identical to the view that you would see in the HTML tab. You can click on any node to inspect it in the HTML tab.

console.trace()

Prints an interactive stack trace of JavaScript execution at the point where it is called.

The stack trace details the functions on the stack, as well as the values that were passed as arguments to each function. You can click each function to take you to its source in the Script tab, and click each argument value to inspect it in the DOM or HTML tabs.

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

Writes a message to the console and opens a nested block to indent all future messages sent to the console. Call console.groupEnd() to close the block.

console.groupEnd()

Closes the most recently opened block created by a call to console.group.

console.time(name)

Creates a new timer under the given name. Call console.timeEnd(name) with the same name to stop the timer and print the time elapsed..

console.timeEnd(name)

Stops a timer created by a call to console.time(name) and writes the time elapsed.

console.profile([title])

Turns on the JavaScript profiler. The optional argument title would contain the text to be printed in the header of the profile report.

console.profileEnd()

Turns off the JavaScript profiler and prints its report.

console.count([title])

Writes the number of times that the line of code where count was called was executed. The optional argument title will print a message in addition to the number of the count.

基于单片机负载控制的无人机电气设备监测系统设计 为深入分析无人机电气设备的电子负载性能,实现对传输电子量的合理性监管与控制,设计基于单片机负载控制的无人机电气设备监测系统;利用电气信号发生电路,构建负载网络控制器与以太网模块运行所需的电气设备负载环境,借助PCB监控板建立PLC扩展负载模块与核心监控主机之间的物理连接关系,实现无人机电气设备监测系统的硬件执行环境搭建;在此基础上,通过STM32型单片机移植协议,确定无人机电气设备通信主机的现有组态形式,联合已设定的监控任务有线级条件,实现监测系统的软件执行环境搭建,完成基于单片机负载控制的无人机电气设备监 阅读详情

相关推荐

Win11只读模式无法关闭的终极解决方案

通过以上方法,我们应该能够解决Windows 11中文件夹无法取消只读状态的问题。如果问题仍然存在,请确保你的账户具有足够的权限来修改文件夹属性,并考虑是否有其他安全软件或策略阻止了权限更改。在操作过程中,请务必小心谨慎,避免误操作导致数据丢失或系统损坏。希望本文能够帮助到大家!

mmoo_python的博客 1万+

(转)FireBug 控制台函数说明

原文地址:http://www.joehewitt.com/software/firebug/docs.php 转载地址:http://www.nirvanastudio.org/javascript/firebug-%e6%8e%a7%e5%88%b6%e5%8f%b0%e5%87%bd%e6%95%b0%e8%af%b4%e6%98%8e.html 译者:Nicholas Ding Con...

weixin_30600503的博客 250

VisionMaster Qt二次开发:图像获取、COM组件渲染与本地化存储实战

本文详细介绍了基于VisionMaster进行Qt二次开发的核心实战流程,涵盖环境搭建、方案加载、图像数据获取、COM组件渲染与本地化存储。重点解析了如何通过COM组件在Qt界面中实时显示图像,以及将VM图像数据转换为QImage并保存为本地文件的关键步骤与常见问题,为工业视觉项目开发提供稳定高效的解决方案。

weixin_29229261的博客 206

FireBug 控制台函数说明(转载)

由于工作中用到了fireBug。无意间看到别人翻译的这分FireBug的控制台函数说明。就转载过来。以后可以随时查阅,也给自己的blog里加点东西。 :D (原文地址:[url]http://www.nirvanastudio.org[/url]) FireBug 控制台函数说明 Posted by Nicholas on 20th 九月 2006 原文地址:http://www...

善待人生,笑对生活... 146

Jupyter Notebook 命名出现“error”且运行后没反应

Jupyter Notebook 命名出现“error”且运行后没反应提前声明错误截图(方便大家看看是不是自己的错误)解决方法 提前声明 我的问题是在看到答主 @开始King的回答后才解决的,因为答主大大的文章后面有些地方不是很详细,我在这里再在King大大的基础上完善一下子 错误截图(方便大家看看是不是自己的错误) 1.命名失败,上面出现一个“error”字样 2.运行失败,无论是点击上方的运行按钮还是按快捷键shift+enter 都只会向下再增加一个代码块,而不会运行程序。 (也不是很多人出现的[*

qq_52770743的博客 1万+

Prism 入门02,区域介绍

什么是区域(Region)?区域,在Prism 框架中,区域是模块化的核心的功能之一,其主要作用是降低应用程序和模块之间的耦合度。使用方式:在应用程序的界面中,划分出某块区域,并为这个区域定义一个唯一的区域名称。那么通过这个区域名称,应用程序就可以找到指定的区域。并为这个区域动态放置一些容器或控件,从而呈现在界面中。

build2024 1126

FireBug使用方法

ExtJs非常難調試,特意轉載了一個firebug使用方法原文地址:http://blog.youkuaiyun.com/tianxiaode/archive/2007/09/02/1769152.aspx  Javascript的调试,是开发Web应用尤其是AJAX应用很重要的一环,目前对Javascript进行调试的工具很多,我比较喜欢使用的是Firebug。Firebug是Joe Hewit

yingxo9的专栏 1万+

(01)ORB-SLAM2源码无死角解析-(38) EPnP 算法原理详解→理论基础二:分情况求得beta初始解

讲解关于slam一系列文章汇总链接:史上最全slam从零开始,针对于本栏目讲解的(01)ORB-SLAM2源码无死角解析链接如下(本文内容来自计算机视觉life ORB-SLAM2 课程课件): (01)ORB-SLAM2源码无死角解析-(00)目录_最新无死角讲解:https://blog.youkuaiyun.com/weixin_43013761/article/details/123092196 文末正下方中心提供了本人联系方式,点击本人照片即可显示WX→官方认证{\color{blue}{文末正下方中心}

江南才尽江南山,年少无知年少狂! 1024

Firebug 控制台指令

Firebug 控制台指令 Firebug 控制台指令 函数 说明 console.log(object[, object, ...]) 向控制台输出一个信息。可以输入多个参数,输出将已空格分隔各参数输出。第一参数可以包含格式化文本,例如:console.log(‘这里有%d个%s’,count,apple);字符串格式:%s :字符串

香巴拉 704

信息传输仿真:卫星通信系统仿真_(12).卫星通信系统仿真软件介绍

卫星通信系统仿真软件是进行卫星通信系统设计和性能优化的重要工具。通过这些软件,用户可以模拟和分析各种通信场景,验证不同的通信协议和算法,优化系统参数和配置。本节介绍了 MATLAB Simulink、NS-3、OPNET 和 SystemVue 的基本功能、特点和配置方法,希望对读者在选择和使用仿真软件时提供参考。在实际应用中,建议根据项目需求和团队能力,综合考虑选择合适的仿真软件。

2401_87715305的博客 1278

Android实现TextToSpeech控件实现语音播报--朗读文字 (附完整源码)

Android实现TextToSpeech控件实现语音播报--朗读文字 (附完整源码)

希望我的博客,能帮上你解决学习中工作中所遇到的问题 1116

FireBug使用指南

本文最初发表《程序员》杂志第三期,现将全文贴上,内容已经过编辑修饰了很多:什么是Firebug从事了数年的Web开发工作,越来越觉得现在对WEB开发有了更高的要求。要写出漂亮的HTML代码;要编写精致的CSS样式表展示每个页面模块;要调试 javascript 给页面增加一些更活泼的要素;要使用Ajax给用户带来更好的体验。一个优秀的WEB开发人员需要顾

shizhong_taosheng的专栏 1289

神州路由器DHCPv6配置

神州路由器DHCPv6配置.。

weixin_41687096的博客 461

火狐插件(firebug)的使用

什么是Firebug从事了数年的Web开发工作,越来越觉得现在对WEB开发有了更高的要求。要写出漂亮的HTML代码;要编写精致的CSS样式表展示每个页面模块;要调试javascript给页面增加一些更活泼的要素;要使用Ajax给用户带来更好的体验。一个优秀的WEB开发人员需要顾及更多层面,才能交出一份同样优秀的作业。为帮助广大正处于Web2.0洪流中的开发人员,在这里为大家介绍一款轻巧灵活的辅助开

猪猪学上树 2497

老版QQ原生表情gif动态

这是老版的QQ表情,不过全是动态的的,Windows照片查看器是不会动的,可以右击用浏览器打开查看,再说一遍是老版的,只是分享给宁愿用老版也要动态的人。

大中型超市收银系统(可直接运行)

光步前台收银系统系统功能:商品销售、商品退货、挂单、收银员权限、会员销售、单品取消、整单取消、商品查询、脱机销售、脱机数据上传,基本资料下载,开钱箱、小票打印、收款结算,支持多币种付款方式(现金、储值卡、礼券、微信等),支持多种促销。运行环境:.net 4.0登陆信息用户名:1001 密码:123456内置商品信息,商品编码可输入00001000 - 00010000,测试效果相关功能键F5 结算 F9挂单 F11商品查询 F8退货 Insert单品取消 Del整单取消 F12开钱箱F2 会员 Ctrl+Z退出系统 Home 锁屏 相关源码待公开

学习WEB开发,从此我爱上了火狐的FireBug

做了牛腩新闻发布系统 ,自己也就开始了真正的B/S学习!开始了真正的入门功课。         现在的Web开发工作,越来越觉得现在对WEB开发有了更高的要求。要写出漂亮的HTML代码;要编写精致的CSS样式表展示每个页面模块;要调试javascript给页 面增加一些更活泼的要素;要使用Ajax给用户带来更好的体验。一个优秀的WEB开发人员需要顾及更多层面,才能交出一份同样优秀的作业。为帮助广

邢金聪 廊坊师范学院九期信息技术提高班 3013

假人有限元模型

假人模型,车辆碰撞假人有限元模型,适合做乘员安全的研究者利用

初识Firebug 全文 — firebug的使用

什么是Firebug从事了数年的Web开发工作,越来越觉得现在对WEB开发有了更高的要求。要写出漂亮的HTML代码;要编写精致的CSS样式表展示每个页面模块;要调试javascript给页面增加一些更活泼的要素;要使用Ajax给用户带来更好的体验。一个优秀的WEB开发人员需要顾及更多层面,才能交出一份同样优秀的作业。为帮助广大正处于Web2.0洪流中的开发人员,在这里为大家介绍一款轻巧灵活

1264

蓝牙模块HM-10手册

蓝牙模块HM-10手册,该手册对蓝牙模块HM-10进行了详细的介绍和使用方法以及一些AT指令。

FireFox FireBug简介

Firebug   Firebug本是Firefox浏览器下一个出色的网页设计插件,随着浏览器的发展,Firebug也推出了支持IE、Opera、 Chrome的Firebug Lite。凭借Firebug的出色代码调试功能,firefox成为了网页设计人员的必备浏览器,为了与其抗争Chrome、IE、Opera等浏览器 也不断推出自己的网页开发插件,但总体来说仍是Firebug占据了上风。

wqc02的专栏 1077

firebug的使用

本文最初发表《程序员》杂志第三期,现将全文贴上,内容已经过编辑修饰了很多:) 什么是Firebug 从事了数年的Web开发工作,越来越觉得现在对WEB开发有了更高的要求。要写出漂亮的HTML代码;要编写精致的CSS样式表展示每个页面模块;要调试javascript给页面增加一些更活泼的要素;要使用Ajax给用户带来更好的体验。一个优秀的WEB开发人员需要顾及更多层面,才能交出一份同样优秀的作业

小木匠盖大厦 689

调试工具Firebug的使用方法

Javascript的调试,是开发Web应用尤其是AJAX应用很重要的一环,目前对Javascript进行调试的工具很多,我比较喜欢使用的是Firebug。Firebug是Joe Hewitt开发的一套与Firefox集成在一起的功能强大的web开发工具,可以实时编辑、调试和监测任何页面的CSS、HTML和JavaScript。本文主要是根据Ext JS 3.0的开发过程,介绍下调试工具Fir

薛敬明的专栏 1万+

怎样使用Firebug图文详解

Firebug本是Firefox浏览器下一个出色的网页设计插件。在此就简要介绍下Firebug的安装和基本使用 1、Firebug的安装。安装完毕最新版火狐浏览器后(本例版本为5.0.1),点击左上角firefox菜单,选择附加组件,如下图: 2、之后在出现的搜索栏中输入“firebug”关键词,出现firebug搜索结果,点击安装后,重启浏览器即可完成安装过程,如下图:   3、Fi

AXIN2710的专栏 809
上一篇: 一个实用的 Javascript XML to JSON Object 对象的转换 (JQuery)
下一篇: SecureCRT 自动登录脚本
subchen
博客等级 码龄25年 33粉丝 77原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值