`

chrmoe 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])
分享到:
评论

相关推荐

    ConsoleImporter从Chrome控制台轻松导入JS和CSS资源

    "ConsoleImporter"是一个非常实用的工具,它使得从Chrome控制台直接导入JS和CSS资源变得异常简单,极大地优化了前端开发的工作流程。 "Console Importer"的核心功能是将外部的JS和CSS文件快速引入到当前页面,这样...

    9个让JavaScript调试更简单的Console命令

    Chrome开发者工具中的Console(控制台)是JavaScript开发者最常使用的一个调试工具,它提供了一系列的命令,使得查找问题和监控程序状态变得更为简便。本文将详细介绍9个常用的Console命令,这些命令能够显著提高...

    Node-Web-Console——基于Node.js的网页版shell

    在实际应用中,Node-Web-Console可广泛应用于远程运维、自动化部署、教学演示等领域,尤其是对那些不熟悉SSH或者希望在无图形界面的服务器上提供简单管理工具的场景。 总结起来,“Node-Web-Console”是Node.js技术...

    如何使用chrome自带的Javascript调试工具

    在 DevTools 中,"Console" 面板用于查看 JavaScript 的运行日志、错误信息以及执行命令。在调试过程中,可以在这里测试和验证代码片段。 6. **断点条件与日志点** 除了简单的行级断点,还可以设置条件断点,只有...

    树莓派lite直接自启动chrome.pdf

    进入Boot Options -> Desktop/CLI -> Console Autologin。 3. 在`.bashrc`文件末尾添加你的启动脚本。例如: ```bash xinit /home/pi/start-c.sh ``` 别忘了前面的`xinit`。 此外,你还可以根据需求添加...

    chrome-remote-interface:适用于Node.js的Chrome调试协议接口

    接口,可通过使用简单JavaScript API提供命令和通知的简单抽象来帮助检测Chrome(或任何其他合适的)。 此模块是许多。 示例API使用情况 以下代码段加载https://github.com并转储每个请求: const CDP = require ...

    vue-devtools chrome vue插件

    8. **Console**:Vue Devtools也提供了一个控制台,可以直接发送Vue实例的方法和属性,便于在调试过程中快速执行命令。 通过熟练使用Vue Devtools,开发者可以极大地提升工作效率,快速定位和修复问题,同时也能更...

    轻松玩转chrome开发者模式

    - **执行JavaScript代码**:可以直接在控制台输入JavaScript命令并执行。 **2.10 移动页面开发模式** 此模式模拟了移动设备环境,允许开发者在桌面端模拟手机屏幕尺寸,调整视口大小,并查看页面在不同设备上的...

    Node.js-git-js一个轻量级接口用于在任何node.js应用程序中运行git命令

    Git-js是针对Node.js环境设计的一个轻量级库,它提供了一个简单易用的接口,允许开发者在他们的Node.js应用中直接调用Git命令,无需离开JavaScript的舒适区。 ### Git-js核心特性 1. **轻量级**:Git-js的核心设计...

    ES插件 Chrome插件 sense_0_9_0.zip

    Sense插件(现在已更名为Kibana的Console)是Elasticsearch社区开发的一个工具,它为开发者提供了一个直观的界面,可以直接在浏览器中执行Elasticsearch的HTTP API命令。用户可以通过这个插件创建、更新、删除索引,...

    Google Chrome 浏览器开发人员工具 教程

    Google Chrome 浏览器的开发人员工具为网页开发者提供了一个全方位的开发环境,从简单的元素查看和修改,到复杂的性能分析和调试,几乎涵盖了所有可能的需求。熟练掌握这些工具的使用方法,将极大地提高网页开发的...

    headless-chrome:使用可在Heroku上运行的Puppeteer的无头Chrome

    在`scripts`部分添加预构建命令,如`"preinstall": "npx install-headless-chrome"`,这将在安装依赖前下载合适的Chrome版本。 - 或者,可以使用`heroku-buildpack-chromedriver`或`heroku-buildpack-google-chrome...

    Node.js命令行接口变得简单.zip

    开发者通常会用到`process.argv`来获取命令行参数,以及`console.log`进行输出。 2. **commander.js** "commander.js_master.zip"这个文件可能包含一个名为`commander`的库,它是Node.js社区中最受欢迎的用于构建...

    task-console:通过Node.js中的控制台执行任务管理器

    在IT行业中,Node.js是一个基于Chrome V8引擎的JavaScript运行环境,它允许开发者在服务器端使用JavaScript编写程序,极大地拓宽了JavaScript的应用范围。本话题主要关注如何利用Node.js实现一个任务控制台,即"task...

    PuttyPlus V1.0

     Console: 这是一个类似windows cmd的功能,支持文件拖曳、命令历史记录,但不支持TAB补全;平时用来配合adb完成push/pull等操作倒是没什么问题了。  多标签界面: PuttyPlus自身不支持多标签,好在有第三方软件可...

    New Tab Console-crx插件

    安装和使用New Tab Console-crx插件相当简单。由于其文件名为`New_Tab_Console.crx`,这表明这是一个Chrome浏览器扩展的CRX文件格式。用户可以直接将此文件拖放到Chrome浏览器的扩展管理页面进行安装,或者通过...

    Node.js-一个超级简单基于cli的任务日志器

    - 使用`console.log`进行调试:在开发过程中,可以使用`console.log`打印中间结果,帮助找出潜在问题。 - 测试框架:如`Mocha`和`Chai`,可以编写单元测试和集成测试,确保代码质量。 7. **发布与分发** - 发布...

    Node.js-简单的nodejs爬虫

    Node.js 是一种基于 Chrome V8 引擎的 JavaScript 运行环境,它让开发者可以用 JavaScript 来进行服务器端编程。在本教程中,我们将探讨如何利用 Node.js 创建一个简单的爬虫,用于抓取 Cnode 社区的精华帖子的标题...

    获取windows当前登录的用户名

    以下是一个简单的示例: ```csharp using System; class Program { static void Main() { string userName = Environment.UserName; Console.WriteLine("当前登录的用户名是: " + userName); } } ``` 这段代码...

    nodeJS+socket.io做一个简单的聊天室

    Node.js是一种基于Chrome V8引擎的JavaScript运行环境,它允许开发者在服务器端使用JavaScript进行编程。其非阻塞I/O模型和事件驱动特性使得它在构建高并发、实时应用时表现优秀,而Socket.IO则是一个为实时应用提供...

Global site tag (gtag.js) - Google Analytics