当前位置: 首页 > 编程日记 > 正文

Firebug Console 与命令行全集

Console API

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

console.log(object[, object, ...])
使用频率最高的一条语句:向控制台输出一条消息。支持 C 语言 printf 式的格式化输出。当然,也可以不使用格式化输出来达到同样的目的:

var animal='frog', count=10; 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])


转自:

brian.netmad
brian.netmad的博客

相关文章:

100%的程序员都想挑战的算法趣题!| 码书

计算机的世界每天都在发生着深刻的变化。新操作系统的发布、CPU性能的提升、智能手机和平板电脑的流行、存储介质的变化、云的普及……这样的变化数不胜数。在这样日新月异的时代中,“算法”是不变的重要基石。要编写高效率的程序,就需要优化算法。无论开…

【Qt】qss样式表之:QCalendarWidget,日历窗口样式表设置

1、效果图: 2、qss样式表 其中表头的背景颜色等设置不起作用,只好在下面的代码中实现。 /*日历*/ QCalendarWidget QHeaderView {qproperty-minimumSectionSize:0; } QCalendarWidget QMenu{background-color: rgb

BZOJ5324 洛谷4563 LOJ2545:[JXOI2018]守卫——题解

https://www.lydsy.com/JudgeOnline/problem.php?id5324 https://www.luogu.org/problemnew/show/P4563 https://loj.ac/problem/2545 题目见上。 参考:https://blog.csdn.net/dofypxy/article/details/80196942 区间dp,设f[i][j]为[i,j]的答案&#xf…

构建高可靠性网络

拓补图如下: 1. 浮动静态路由配置一条主链路,一条辅助链路!正常情况使用主链路,主链路出现故障,切换到辅助链路!H3C主线路 s0-s0 采用ospf 默认度量值是10,辅助线路 s1-s1 配置静态路由,默认度量值是10,无需调整,数据包默认值走s0-s0链路CISCO主线路 s0-s0 采用ospf 默认度量…

LeetCode上最难的链表算法题,没有之一

作者 | 程序员小吴转载自五分钟学算法(ID: CXYxiaowu)该题在 LeetCode 官网上有关于链表的问题中标注为最难的一道题目:难度为 Hard ,通过率在链表 Hard 级别目前最低。题目描述合并 k 个排序链表,返回合并后的排序链表…

【Qt】qss样式表之:自定义属性实现动态切换样式

1、问题描述 例如在播放器中播放按钮,由“播放”状态切换成“暂停”状态后,响应的图标要跟着状态切换。 2、解决方法 使用qss样式表中的属性功能,自定义一个属性,当按钮动作时,改变它的属性值。 在qss中分别对不同的属性值设置 样式。 但是qss不能自动监听属性值的变…

深入学习Lock锁(2)——LockSupport工具类

2019独角兽企业重金招聘Python工程师标准>>> 在同步组件中,当需要阻塞或唤醒一个线程的时候,都会使用LockSupport工具类来完成相应 工作。LockSupport定义了一组的公共静态方法,这些方法提供了最基本的线程阻塞和唤醒功能&#xf…

受用一生的高效PyCharm使用技巧(二)

本文转载自公众号Python编程时光(ID: Python-Time)今天又来给大家推荐一些我自己的用的小技巧,大家择需所取即可。如果你还没看过,可以下面的传送门,直接访达:受用一生的高效 PyCharm 使用技巧(…

【GStreamer】基本概念及安装

一、参考网站 官方主页 https://gstreamer.freedesktop.org/ 官方手册 https://gstreamer.freedesktop.org/data/doc/gstreamer/ 官方教程: https://gstreamer.freedesktop.org/documentation/tutorials/index.html 官方基础教程 https://gstreamer.freedesktop.org/docum…

python学习day3

1丶 用户先进行登陆如果用户名在文件中且用户密码也正确就登陆成功调用购物车函数,如果用户用户名输入正确密码错误,提示用户密码错误且重新输入,如果用户 输入用户名不存在,提示用户是否创建该用户,调用注册函数。 1.…

Visual Studio 2010构建Web浏“.NET研究”览器应用程序

2001年,我使用C#中的WebBrowser ActiveX控件编写了我的第一个应用程序,点此阅读,Kapil Sony写了一篇文章介绍了C# 2.0中上海企业网站制作的WebBrowser控件,每一次.NET新版本发布,控件和功能都会发生一些变化&#xff0…

如何通过结构化智能体完成物理构造任务?| 技术头条

作者 | Victor Bapst, Alvaro Sanchez-Gonzalez,Carl Doersch, Kimberly L. Stachenfel译者 | Linstancy编辑 | 一一出品 | AI 科技大本营(ID:rgznai100)摘要物理构造 (physical construction) 是根据物理动力学原理构造带有一些功能的物体的能力&#x…

【GStreamer】gstreamer工具详解之:gst-launch-1.0

一、gst-launch-1.0 1、简介: gst-launch-1.0构建和运行基本GStreamer管道的工具 官网:https://gstreamer.freedesktop.org/documentation/tools/gst-inspect.html?gi-language=c 命令格式: gst-launch-1.0 [OPTIONS] PIPELINE-DESCRIPTION2、OPTIONS参数选项: –help…

WPF查找子控件和父控件方法

原文:WPF查找子控件和父控件方法public List<T> GetChildObjects<T>(DependencyObject obj, string name) where T : FrameworkElement{DependencyObject child null;List<T> childList new List<T>();for (int i 0; i < VisualTreeHelper.GetCh…

ARP(Accounting Resource Planning)项目感想

ARP是Accounting Resource Planning&#xff08;会计资源计划&#xff09;的简称。转载于:https://blog.51cto.com/lya041/690079

【GStreamer】gstreamer工具详解之:gst-inspect-1.0

二、gst-inspect-1.0 1、简介 gst-inspect-1.0 打印插件列表、指定插件或指定元素的信息 2、命令格式: gst-inspect-1.0 [OPTION...] [PLUGIN|ELEMENT]3、OPTION参数选项: --help --gst-info-mask=FLAGS 设置GStreamer信息标志?? -a, --print-all 打印所有插件和元…

心酸科研路:3年前CVPR论文,仅被引用11次,如今成就黑洞照片!

众所周知&#xff0c;黑洞照片已经朋友圈刷屏了&#xff0c;可你也许不知道这张照片背后的一个故事。 译者 | Linstancy、Major 编辑 | 琥珀 出品 | AI科技大本营&#xff08;公众号ID&#xff1a;rgznai100&#xff09; 近日&#xff0c;由天文学家公布的人类首张黑洞照片引…

Redis和Memcache的区别是什么

Redis和Memcache都是内存数据库&#xff0c;但它们之间还是有区别的&#xff0c;跟着ytkah看看Redis和Memcache的区别吧 Redis 支持多种数据结构&#xff0c;如string,list,dict,set,zset,hyperloglog 单线程请求&#xff0c;所有命令串行执行&#xff0c;并发情况下不需要考虑…

windows加载符号小计

1、如果当前并没有设置符号路径和符号服务器&#xff0c;且当前正在调试&#xff0c; 则需要设置符号服务器和路径后&#xff0c;重新调试生效 2、如果当前有些pdb没有加载&#xff0c;因为这些pdb放在其他路径了&#xff0c;未加载&#xff0c;当把pdb拷到程序启动目录时&…

谈谈Python那些不为人知的冷知识(一)

本文转载自公众号Python编程时光&#xff08;ID:Python-Time&#xff09;小明在日常Code中遇到一些好玩&#xff0c;冷门的事情&#xff0c;通常都会记录下来。现在已经积攒了一些了&#xff0c;最近打算整理一波&#xff0c;发出来给大家补补。一篇只分享五个&#xff0c;有时…

【GStreamer】gstreamer工具详解之:ges-launch-1.0

三、ges-launch-1.0 1、简介 ges-launch-1.0:视频裁剪编辑,GStreamer编辑服务原型工具 详见官网:https://gstreamer.freedesktop.org/documentation/tools/ges-launch.html?gi-language=c#mandatory-arguments1 ges-launch-1.0 创建多媒体时间线并将其回放,或将其呈现为…

三大软件公司争霸赛区块链

导语&#xff1a;\\区块链技术发展到今天&#xff0c;区块链的扩容、吞吐量、运维弹性&#xff08;Operational Resilience&#xff09;、安全性、企业支持和Token管理等挑战&#xff0c;已成为区块链进一步发展绕不开的技术问题。\\突破这些现实技术挑战&#xff0c;不仅构能建…

【系列索引】结合项目实例 回顾传统设计模式 打造属于自己的模式类系列

网上设计模式的文章很多 虫子就不再和大家扯一些没有营养的理论 开此系列博文 一方面因为自己颓废了大半年 趁此机会回顾一下 另一方面希望能够帮助新人走出设计模式的误区, 如何做好设计模式 1.在发掘新的模式之前&#xff0c;必须熟悉理解现有的模式。许多模式看起来像是全新…

【GStreamer】gstreamer工具详解之:gst-discoverer-1.0

四、gst-discoverer-1.0 1、简介 gst-discoverer-1.0用于显示文件元数据和流信息,它可以运行在单独的文件或整个目录(递归到子目录中)。 2、命令格式: gst-discoverer-1.0 FILE|DIRECTORY|URI [FILE2|DIRECTORY2|URI2]选项详解 帮助选项 -h, --help Show help options…

一道简约而不简单的算法题——数据流的中位数 | 附动画解析

作者 | 程序员小吴转载自微信公众号&#xff08;ID:CXYxiaowu&#xff09;题目来源于 LeetCode 上第 295 号问题&#xff1a;数据流的中位数。难度级别为 Hard&#xff0c;目前通过率为 33.5% 。题目描述中位数是有序列表中间的数。如果列表长度是偶数&#xff0c;中位数则是中…

HBase安装与命令行操作

2019独角兽企业重金招聘Python工程师标准>>> HBase简介 基于Hadoop的NoSql数据库&#xff0c;适合存储半结构化、非结构化的稀疏数据&#xff0c;提供增删改查能力。因为其底层是hdfs&#xff0c;所以具有存储海量数据&#xff0c;高容错&#xff0c;高可用等特点&a…

zip/unzip 命令

zip 命令 功能说明&#xff1a;压缩文件。语 法&#xff1a;zip [-AcdDfFghjJKlLmoqrSTuvVwXyz$][-b <工作目录>][-ll][-n <字尾字符串>][-t <日期时间>][-<压缩效率>][压缩文件][文件...][-i <范本样式>][-x <范本样式>]补充说明&#xf…

《App架构师实践指南》:移动开发的进阶指南

文章主要内容&#xff1a;什么是 app 架构师这本书主要内容读完感受什么是 App 架构师成为“架构师”是许多程序员的梦想&#xff0c;当然也包括我&#xff0c;在工作的几年里&#xff0c;我见过很多架构师&#xff0c;他们在设计某个大型系统时具备很大的话语权&#xff0c;可…

FoveaBox:目标检测新纪元,无Anchor时代来临 | 技术头条

作者 | CV君转载自我爱计算机视觉&#xff08;ID:aicvml&#xff09;目标检测的任务是“分类”并从图像中“定位”出物体&#xff0c;但长久以来&#xff0c;该领域的工作大多是这样&#xff1a;生成可能包含目标的区域&#xff0c;然后在该区域提取特征并分类。显然&#xff0…

【Ubuntu】安装中文输入法、终端不支持中文的解决方法

一、中文输入法安装 1、安装汉语语言包 sudo apt install fcitx sudo apt install language-pack-zh-hans2、安装google拼音输入法 sudo apt install fcitx-googlepinyin安装完毕后&#xff0c;重启或者退出登陆 3、安装sun-pinyin输入法 sudo apt install fcitx-sunpinyi…