断点类型 | chrome devtool

断点类型

  • Line-of-code 行断点

  • Conditional line-of-code 条件断点

  • DOM

  • XHR

  • Event listener 事件监听断点

  • exception 异常断点

DOM change 断点

断点类型 | chrome devtool_第1张图片

Types of DOM change breakpoints:

  • Subtree modifications. Triggered when a child of the currently-selected node is removed or added, or the contents of a child are changed. Not triggered on child node attribute changes, or on any changes to the currently-selected node.(当子节点本身被删除或添加时触发)

  • Attributes modifications: Triggered when an attribute is added or removed on the currently-selected node, or when an attribute value changes.(当属性被删除或添加时触发或者属性改变时触发)

  • Node Removal: Triggered when the currently-selected node is removed.(当前节点被删除时触发)

XHR节点

右侧调试区有一个 XHR Breakpoints,点击+ 并输入 URL 包含的字符串即可监听该 URL 的 Ajax 请求,输入内容就相当于 URL 的过滤器。如果什么都不填,那么就监听所有 XHR 请求。一旦 XHR 调用触发时就会在 request.send() 的地方中断。

断点类型 | chrome devtool_第2张图片

异常断点

不论是捕捉还是没捕捉都可以用这个异常断点

断点类型 | chrome devtool_第3张图片

你可能感兴趣的:(chrome-devtools)