大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。
Jetbrains全系列IDE稳定放心使用
虽然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面板
发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/188459.html原文链接:https://javaforall.cn
【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛
【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...