Chrom开发者工具source面板的使用

385 查看

调试窗口介绍
  • 指针: 选择页面中的元素
  • 手机: 使用移动端界面调试
  • Elements: 查看页面 DOM 树
  • Console: 控制台(注意, 控制台与该页面是一个整体, 在控制台中的任何操作, 会影响到页面)
  • Source: 代码调试

    Source面板的使用

    面板右侧几个按钮的作用

  • 逐过程运行, 一次运行一个函数
  • 单步运行(逐步运行), 一次运行一句, 如果是函数, 进入函数体内运行
  • 继续运行. 从当前状态运行下去, 直到出现断点, 如果没有断点则运行结束

设置断点技巧

  • 逐步与逐过程混合
  • 断点加继续运行
  • 条件断点(右键添加 add contitional breakpoint)

利用 watch 监视窗口可以查看对象成员