前端Chrome调试小技巧汇总

如何保持元素的 hover 等状态(保持鼠标放上去的效果)

 

Ctrl+F 搜文字定位dom节点

 

复制日志对象

   先右键保存全局对象
   console输入
   copy(temp1)

 

不同网速测试

 

定位，通过键盘上下可以修改大小 按住Ctrl，以10为单位修改大小

 

样式级别(由上到下)

 

 

样式最终计算值(查看元素最终的样式)

 

不要只会console.log

console.log      正常输出
console.error   错误输出
console.warn   警告
console.table   更方便查看
console.table   更方便查看
占位符有：字符（%s）、整数（%d或%i）、浮点数（%f）和对象（%o）

如何查看被压缩的 JS/CSS 源码，点击格式化

 

network 只看http请求

 

分析JS性能