一、Console API

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

(1) 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”);

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

向控制台输出一条信息,它包括一个指向该行代码位置的超链接。

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

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

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

同 info。区别是图标与样式不同。

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

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

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

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

(7) console.dir(object)

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

(8) console.dirxml(node)

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

(9) console.trace()

输出 Javascript 执行时的堆栈追踪。

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

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

(11) console.groupCollapsed()

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

(12) console.time(name)

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

注:console.time(slugName) – console.timeEnd(slugName) – 记录某一个时间戳的执行时间,可用于优化循环语句

(13) console.profile([title])

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

(14) console.count([title])

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

(15) console.clear()

清空控制台

二、命令行

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

(1) $(id)

返回一个给定id 的元素。

(2) $$(selector)

返回给定的 css 选择器匹配到的一组元素。

(3) $x(xpath)

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

(4) $0

在 HTML 面板中选中的元素。

(5) $1

上一次在 HTML 面板中选中的元素。

(6) $n(index)

访问最近 5 个被选中过的元素,index 的范围: 0 – 4。

(7) dir(object)

同 console.dir(object)。

(8) dirxml(node)

同 console.dirxml(node)。

(9) clear()

同 console.clear()。

(10) inspect(object[, tabName])()

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

(11) keys(object)

返回一个对象的所有属性的键。

(12) values(object)

返回一个对象的所有属性的值。

(13) debug(fn)

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

(14) monitor(fn)

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

(15) monitorEvents(object[, types])

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

(16) monitorEvents($0,['click'])

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

(17) profile([title])

同console.profile([title])

Console API 与命令行的更多相关文章

  1. 浅析console和浏览器命令行API

    一.console对象: F12或者Control+Shift+i(Win)/ Alt+Command+i(Mac)打开浏览器自带的开发工具,选择顶部tab中的最后一项console,这样你就可以尽情 ...

  2. java console ( mac osx ) 命令行编码

    方法 vi ~/.bash_profile #添加新行, UTF-8表示你平台的编码方式 #例如你是GBK.GB18030的 #替换成你平台console可现实字符编码即可 export JAVA_T ...

  3. 控制台命令行API

    js调试系列: 控制台命令行API   上次初步介绍了什么是控制台<js调试系列: 初识控制台>,以及简单的 console.log 输出信息.最后还有两个小问题,我们就当回顾,来看下怎么 ...

  4. js调试系列: 控制台命令行API

    js调试系列目录: - 上次初步介绍了什么是控制台,以及简单的 console.log 输出信息.最后还有两个小问题,我们就当回顾,来看下怎么操作吧. 先打开百度,然后按 F12 打开后,如果不是 C ...

  5. 不依赖远程API启动SEER区块链命令行钱包和网页钱包的方法

    不依赖远程API启动命令行钱包和网页钱包的方法 在SEER的见证人操作等需要使用命令行钱包的操作中,我们介绍了通过钱包连接远程API来和区块链交互的方法.类似这样: cli_wallet.exe -s ...

  6. python实现命令行解析的argparse的使用

    参考https://docs.python.org/3.6/library/argparse.html argparse模块使编写用户友好的命令行界面变得很容易.程序定义了它需要什么参数,argpar ...

  7. 2d命令行小游戏源码

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  8. 使用 CliWrap 让C#中的命令行交互举重若轻

    在代码中进行命令行交互是一个很常见的场景, 特别是在一些CI CD 自动化流程中, 在这之前我们会使用 System.Diagnostics.Process API, 现在有一个更灵活的工具 CliW ...

  9. Firebug Console 与命令行全集

    Console API 当打开 firebug (也包括 Chrome 等浏览器的自带调试工具),window 下面会注册一个叫做 console 的对象,它提供多种方法向控制台输出信息,供开发人员调 ...

随机推荐

  1. 转:DataGridView列的宽度、行的高度自动调整

    注意:DataGridView控件是从.NET Framework 2.0版本开始追加的. 介绍一下DataGridView列的宽度和行的高度,根据单元格或Header的内容(一般是内容全部被表示)自 ...

  2. Working with HTTP

    A WebClient façade class for simple download/upload operations via HTTP or FTP WebRequest and WebRes ...

  3. 除法 Division

    除法 题目链接:http://acm.hust.edu.cn/vjudge/contest/view.action?cid=84562#problem/A 题意: 输入正整数n按从小到大的顺序输出所有 ...

  4. 可能碰到的iOS笔试面试题(4)--C语言

    可能碰到的iOS笔试面试题(4)--C语言 可能碰到的iOS笔试面试题(4)--C语言 C语言,开发的基础功底,iOS很多高级应用都要和C语言打交道,所以,C语言在iOS开发中的重要性,你懂的.里面的 ...

  5. [CareerCup] 15.5 Denormalization 逆规范化

    15.5 What is denormalization? Explain the pros and cons. 逆规范化Denormalization是一种通过添加冗余数据的数据库优化技术,可以帮助 ...

  6. SurfaceView的简单使用

    package com.example.administrator.mystudent.surfaceView; import android.content.Context; import andr ...

  7. 输入n个整数,输出其中最小的k个

    描述 输入n个整数,输出其中最小的k个. 详细描述: 接口说明 原型: bool GetMinK(unsignedint uiInputNum, int * pInputArray, unsigned ...

  8. php图片转为资源数据

    $file='C:\Users\feng\Desktop\images\banner.png';  //图片路径 $type=getimagesize($file);                 ...

  9. Bootstrap 固定定位(Affix)

    来自:慕课网 http://www.imooc.com/code/5396 Affix 效果常见的有以下三种: ☑ 顶部固定 ☑ 侧边栏固定 ☑ 底部固定 固定定位--声明式触发固定定位 Affix ...

  10. IOS网络第二天 - 02-异步HTTP请求block回调 解析

    ************** #import "HMViewController.h" #import "MBProgressHUD+MJ.h" @interf ...