在 DevTools 中检测作用于元素的代码
Detect the code acting on an element in DevTools
我有一个网页，其中打开了 Dev/F12 工具（在 Chrome 中）。
调整页面大小时，观察到的 div 样式属性之一肯定会被某些 JavaScript 代码修改（chrome 以紫色显示修改后的属性）：
有没有办法知道 JS 代码到底做了什么，跟踪修改 DOM 元素的 JS 源？
是的，您可以使用 Chrome 的开发工具 DOM 断点 来做到这一点：
- 在“元素”窗格中找到元素（您已完成）
- Right-click 元素并选择 Break on > attribute modifications（因为更改内联样式涉及修改
style 属性的值）
当修改发生时，断点将在该点停止JavaScript执行并在“源”选项卡中显示相关脚本。
如果您有时需要查看我们的 DOM 断点列表，它们位于元素面板右侧面板中的 DOM 断点选项卡中。
我有一个网页，其中打开了 Dev/F12 工具（在 Chrome 中）。
调整页面大小时，观察到的 div 样式属性之一肯定会被某些 JavaScript 代码修改（chrome 以紫色显示修改后的属性）：
有没有办法知道 JS 代码到底做了什么，跟踪修改 DOM 元素的 JS 源？
是的，您可以使用 Chrome 的开发工具 DOM 断点 来做到这一点：
- 在“元素”窗格中找到元素（您已完成）
- Right-click 元素并选择 Break on > attribute modifications（因为更改内联样式涉及修改
style属性的值）
当修改发生时，断点将在该点停止JavaScript执行并在“源”选项卡中显示相关脚本。
如果您有时需要查看我们的 DOM 断点列表，它们位于元素面板右侧面板中的 DOM 断点选项卡中。