虽然devtool一直在用，可是平时使用的也就那几个功能，最近看了一遍谷歌官方的DevTool文档。主要记录一些平时没怎么用过的地方。
断点调试js
| 断点类型 | 使用目的 |
|---|---|
| Line-of-code | 在精确的某一行 |
| Condition line-of-code | 在某一行，但是只有特定情况下才触发 |
| DOM | 在特定DOM节点或者他的子节点改变时触发 |
| XHR | when an XHR URL contains a string pattern |
| 事件监听 | |
| 异常 | 当代码抛出异常时触发 |
| 函数 | 特定函数被调用时 |
source 面板
- 在source面板中可以编辑CSS和JS文件，CSS文件在编辑后立即生效，JS文件需要按下Control+S之后生效。值得注意的是应用JS的更改时，不是重新加载整个JS，而是只重新加载变化的函数
无障碍功能
审计（audit）一个页面的无障碍功能
console 面板
Command Line API
$_
$_返回最近计算的表达式的值
$0-$4
$0、$1、$2、$3 和 $4 命令用作在 Elements 面板中检查的最后五个 DOM 元素或在 Profiles 面板中选择的最后五个 JavaScript 堆对象的历史参考
$(selector)
$(selector) 返回带有指定的 CSS 选择器的第一个 DOM 元素的引用。此函数等同于 document.querySelector() 函数。
如果使用了第三方库，比如jQuery，则此功能将会被覆盖。
$$(selector)
$$(selector) 返回与给定 CSS 选择器匹配的元素数组。此命令等同于调用 document.querySelectorAll()。
$x(path)
$x(path) 返回一个与给定 XPath 表达式匹配的 DOM 元素数组
table(data[, columns])
通过传入含可选列标题的数据对象记录具有表格格式的对象数据。例如，要在控制台中显示使用 table 的名称列表，需要执行：
var names = {
0: {
firstName: "John", lastName: "Smith" },
1: {
firstName: "Jane", lastName: "Doe" }
};
table(names);
performance面板
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/188459.html原文链接：https://javaforall.net
![微型计算机的字节取决于什么的宽度,计算机字长取决于什么的长度[通俗易懂]](https://javaforall.net/wp-content/uploads/2020/11/2020110817443450-480x300.jpg)
