跟踪在页面加载时应用内联样式的JavaScript

我正在管理一个DNN站点，并试图找到“宽度：100%”内联样式应用于我主页上某些元素的来源。DNN中包含了大量难以手动解析的JS库，但我打开了Chrome开发者工具，在Sources选项卡中搜索页面上加载的每个JS文件，查看“100%”的使用位置。没有骰子

我知道在…>属性修改功能。这一直被认为是解决我发现的类似问题的方法：

问题在于，与“源”选项卡中的调试JavaScript不同，“元素”选项卡中HTML元素的调试点在刷新网页时会被清除，而我试图跟踪的脚本在页面加载时只运行一次，在运行时不会再次运行，所以断点永远不会被击中

在页面加载期间，是否有其他方法可以识别DOM中特定元素的属性在何时何地发生更改？或者跟踪特定属性

在属性发生更改的元素之后，立即用

调试器
语句放置一个脚本标记：

<div></div>
<script>debugger</script>


调试器

在检查器打开的情况下重新加载页面

切换到“元素”选项卡，并向元素添加属性删除断点

恢复脚本执行

---

DevTools现在将突出显示更改属性的代码。

由于我名声不好，我需要为此创建一个答案，而不是注释

如果

打断…>属性修改

---

不适用于您，@metarmask提供的解决方案也无法帮助您查看浏览器中的插件。我也遇到了同样的问题，只是停用了所有插件，突然间，使用断点一切正常。

我刚刚用刷新测试了“Break on…>Attributes Modifications”选项，刷新后它仍然存在。您是否尝试过重新启动浏览器或确保URL在刷新之间没有变化？@MikeC-Positive。URL不会更改。开发工具的前后图像：在确定罪魁祸首之前，能否尝试逐个删除库？属性正在更改的元素通过DNN HTML模块呈现。如果我试图将任何标记添加到此内容区域，DNN只会在模块保存过程中将其删除。我可以在模块的“页眉”和“页脚”中添加脚本，所以我尝试在页脚中添加调试器（在HTML元素之后的某个点，虽然不是紧跟其后），这确实会使断点粘住（刷新时圆圈图标仍然存在），但所有DevTools都会在我刚才添加的调试器行上停止，而不是元素标签上的任何地方。我找到了源。。。但我真的不能告诉你怎么做。在jquery.js库中的某个地方，调试器停了一会儿，我试图从内存中回忆调试器所在的位置，在那里设置一个断点，然后（慢慢地）遍历经过它的数百个元素。。。当我的问题元素最终出现时，我通过调用堆栈找到了源代码：一个简化的JS插件，DevTools为我临时简化了它。这就解释了为什么我从来没有在有问题的文件中找到纯文本的“100%”。@AJ_H-我现在面临着类似的问题。我正在使用一个遗留框架，它有很多js代码，有一行代码将样式应用于所有输入元素并设置高度。绝对是噩梦。