chrome控制台的几个使用技巧

学会如下几个chrome console的使用技巧,会给你的调试工作带来更多便捷。

$0

当你在Elements选项卡中选中一个元素节点,然后在控制台输入$0则代表当前节点对象,再输入$1则表示该节点的父节点,$2表示其父节点的父节点,以此类推。

$

如果在当前全局对象中没有类似于jQuery这种全局的$对象的话,在chrome中$表示document.querySelector的别名。

$$

这是document.querySelectorAll的别名,比起写一大长串,这个更加精简。例如,输入$$('div')表示获取div的所有节点对象。

$_

表示上一次的输入结果,比如我上一次输出localStorage,那么,我再输入$_就是localStorage的内容。

复制控制台内容copy

有时候想打印一个对象到控制台上,如果对象内容比较多,复制起来会特别不方便,再或者是想打印一段链接,如果链接比较长,在控制台中并不能全部显示完,而是显示的省略号,如果想要复制,比较麻烦。那么,在这里就可以用copy这个方法。

比如,我想复制所有的localStorage对象到剪切板中,就可以运行copy(localStorage)

当然,还可以结合上面的$_来复制上一次执行的结果。在控制台先运行localStorage,然后再运行copy($_)同样复制的是localStorage对象内容。

如果您觉得本文对您有用,欢迎捐赠或留言~
微信支付
支付宝

发表评论

您的电子邮箱地址不会被公开。 必填项已用 * 标注