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.

FC7300 SPI MCAL配置引导 Example - QMI8A01z外设:Example - QMI8A01z外设: 阅读详情

相关推荐

接地设计的本质:按电流类型选择物理连接方式

接地是电子系统中实现电位参考、噪声抑制与安全保护的基础技术,其核心原理在于为不同性质的电流提供可控的低阻抗返回路径。从直流到GHz频段,电流的频率特性、能量等级和持续时间决定了接地的物理实现方式——工频安全电流依赖低电阻导体,高频噪声需低感平面或磁珠衰减,ESD脉冲要求受控泄放电阻,浪涌能量则必须通过独立短路径导入大地。这种‘目的决定方式’的设计逻辑,直接关联EMC合规性、信号完整性与系统可靠性。本文聚焦PCB级与设备级工程实践,详解安全地、功能地、浪涌地与静电地的判据差异及六种典型连接策略,帮助硬件工程师

weixin_36369848的博客 260

(转)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

rag综述——RAG技术发展流程、最新技术挑战与系统级优化

RAG技术发展综述:本文系统梳理了检索增强生成(RAG)技术的演进历程,从2017年开放域问答中的早期探索,到2020年正式提出RAG架构并与大模型深度融合,再到2025年向系统化、可信化和智能体化发展。当前RAG面临检索可靠性、系统效率和生成可信度三大核心挑战,解决方案包括领域自适应训练、强化语义编码、迭代检索策略等优化方向。未来RAG将向GraphRAG、SafeRAG等方向发展,从单纯性能优化转向构建可控、可审计的语言系统框架,成为高可靠大模型应用的基础设施。

lovehu6686的博客 1242

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

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

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

论文阅读笔记---Deep HDR Video from Sequences with Alternating Exposures

Kalantari N K, Ramamoorthi R. Deep HDR Video from Sequences with Alternating Exposures[C]//Computer Graphics Forum. 2019, 38(2): 193-205. 摘要: 在本文中,提出了一种基于学习的方法来,我们使用两个顺序卷积神经网络(CNN)对整个HDR视频重建过程进...

qq_25283239的博客 1447

ComfyUI实战:AnimateDiff与ControlNet结合,打造无缝风格化视频转绘

本文详细介绍了如何利用ComfyUI平台,结合AnimateDiff与ControlNet插件,实现高质量的视频风格化转绘。通过搭建节点工作流、调整关键参数,有效解决画面闪烁与失真问题,并分享了进阶玩法与常见问题解决方案,帮助用户轻松打造流畅、风格统一的动态视觉效果。

weixin_29039773的博客 337

FireBug使用方法

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

yingxo9的专栏 1万+

影刀RPA进阶:Excel多条件筛选与数据提取实战

本文详细介绍了如何利用影刀RPA实现Excel多条件筛选与数据提取的自动化。通过拆解文本、数值、日期及颜色筛选等核心指令,并结合实战案例,指导用户构建稳健的销售数据提取机器人,从而高效处理复杂数据报表,提升工作效率。

onion的博客 530

Firebug 控制台指令

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

香巴拉 704

代码实现ROS2bag录制数据和回放数据(C++)

ROS2的ROS2bag功能可以将指定Topic中的数据以.db3的格式(不同于ROS)保存到本地文件中。读取文件数据可以实现数据回放。

m0_57124501的博客 3256

人工智能训练师三级补贴3120元申领全攻略|条件+流程+五省市对比

补贴是真的,但不是"白给"的。你需要满足社保、户籍、时间等条件,严格按照流程操作。记住四件事先确认自己是否满足条件,再报名——别考完了才发现领不到紧缺工种补贴更高——确认你所在城市是否在紧缺目录中证书下发后12个月内申请——设个日历提醒材料准备齐全再提交——避免来回折腾如果你正在考虑考人工智能训练师三级证书,想要从报名到备考到拿证到申领补贴的完整一站式指南,欢迎查看我的付费专栏:📖《人工智能训练师三级·从零到拿证完全指南》80篇系统化内容,覆盖报名、备考、冲刺、拿证全流程。

白话机器学习 1524

FireBug使用指南

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

shizhong_taosheng的专栏 1289

QCM2290 PM-3 如何让mirco-usb支持关机充电

PM4125-3插入type-C触发开机进入关机充电的CC脚中断条件是否可以软件上屏蔽, 做到只通过VBUS中断即可触发进入关机充电模式,达到和PM4125-2的效果一样只要插入micro USB 就可以触发进入关机充电模式。硬件团队提议修改寄存器 SCHG_L_MISC_SYSOK_CFG 0x164A bit[4] 目前修改如下 — a/BOOT.XF.4.1/boot_images/QcomPkg/Library/PmicLib/target/Agatti_pmCocos/psi/pm_confi

墨染天玑的博客 443

火狐插件(firebug)的使用

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

猪猪学上树 2497

android 蓝牙通讯demo

android 下蓝牙通讯demo,实现了发现蓝牙,使能蓝牙,通过蓝牙发送消息。

lwip-2.0.3

lwip是瑞典计算机科学院(SICS)的Adam Dunkels 开发的一个小型开源的TCP/IP协议栈。实现的重点是在保持TCP协议主要功能的基础上减少对RAM 的占用。

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

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

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

IMSL CNL 7.0.0 (x86-64)Crack

IMSL CNL 7.0.0 (x86-64)Crack intel的算法库破解文件,这是C++版本的破解文件

初识Firebug 全文 — firebug的使用

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

1264

jdk-8u144-linux-x64.tar.gz.

该资源为搭建Linux系统Java环境用,资源的后缀为tar.gz格式的压缩包

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、付费专栏及课程。

余额充值