chrome调试

(1)表格打印
image.png
(2)

F8 运行到到下一个断点之前
F9 步进(会进入当前函数)
F10 步进 (不会进入当前函数)

(3)一些小技巧
  • 在elements里面通过拖拽来进行两个dom元素的交换
  • 通过$0可以在控制台中拿到你选中的dom元素
  • 使用$_可以拿到你在控制台上一次计算得到的结果
  • 修改css属性后,可以通过点击css属性找到在source中对应的文件,并通过右键save as来进行保存
  • 控制台中使用enter+shift进行换行
  • 右键点击dom元素通过break on 也可以打断点
(4)打印对象与数组

console 中打印出的对象或者数组,在你打印出他内容之前,是以引用的方式保存的。
打印修改前后的对象都会显示修改后的结果。
解决办法:

  • 打印一个从这个对象复制出来的对象。
  • 使用 JSON.stringify() 方法处理打印的结果
  • 断点调试
(5)控制台数据的拷贝

如果你想拿到控制台打印的数组或者是对象,嵌套了很多层,复制下来,可以先进行save as global得到一个temp1变量,然后使用copy( temp1 )就将想要的数据拷贝到剪贴板了,直接进行粘贴就行了

(6)source面板
  • ctrl + p 进行文件搜索
  • 在希望打断点的代码前加上 debugger;