日拱一卒-谈谈Dom断点

在开发过程中，打断点是很常见的一种调试方法。
除了在代码中打断点外，谷歌的控制台还提供了其他类型的断点，比如XHR断点，还有今天谈谈的Dom断点。

在Element面板中，选择对应的节点右键，选择Break on，就会出现三个选项，分别是：

1. Subtree modifications（子节点变化断点）
2. Attributes modifications（节点属性断点）
3. Node removal（节点移除断点）

1.子节点变化断点：
也就是该节点的子节点有了新增、删除、交换顺序时会出现的断点
2.节点属性断点：
该节点的属性有了变化时会出现的断点
3.节点移除断点
该节点被移除时会出现的断点

当以上事件发生的时候，控制台就会自动跳到执行相应操作的js代码上。比如更改属性的代码，或者移除节点的代码。也就是说，最终还适用于调试js的，也就是方便js中对dom操作的调试。