ChromeDevTools的一些使用技巧

我们可以通过这些小技巧来更效率我们的开发调试工作。

1、在控制台获取上次操作返回的值

我们可以使用 $_ 作为1个变量, 来拿到上次控制台显示的值

1
2
3
const ar = [1,2,3];
ar;
$_

2、在控制台打印当前选中的dom元素

鼠标点中需要打印的dom元素, 在控制台输入 $0 即可打印出选中元素节点, 等同于 document.querySelector

1
2
$0
$0.textContent

3、使用copy命令

对于内容过多的地方, 我们可以使用 copy 方法来将内容拷贝到我们的剪切板内, 还是拿script标签举例

1
copy($0.textContent)

按下回车后, 相关内容就已经进入到剪切板内了

持续更新中…