Google chrome 如何使用ChromeDevTools来确定是什么将特定元素添加到页面中？

这个问题类似于，只是它是相反的

我正在尝试调试哪个JS向页面添加了一堆rogue

aswift_1
、
aswift_2
等元素，如下所示：

我想使用ChromeDevTools（或Firefox）在添加此类元素后立即暂停执行，并检查调用堆栈，希望找到罪魁祸首

其他想法也很受欢迎。
chrome中最快的方法是查看网络选项卡（用于响应）或在Windows上使用Ctrl+Shift+F进行全局搜索，并查找添加到DOM的元素中使用的特定标记。
您可以使用这个简单的chrome扩展。
添加了
id
matching
aswift\
的元素后，它将触发调试器（当然，您需要先打开chrome开发工具）


要激活此扩展下载->解包，请打开
manifest.json
，并在第8行将
example.com
更改为要检查的域

然后去chrome://extensions/
单击
Developer mode
和
Load unpacketed

当您转到加工域的页面时，这应该在添加以
aswift\u
开头的
id
元素后显示：

现在您可以使用“跳过下一个函数调用（F10）”（您可能需要点击它几次，然后它将循环通过所有突变并“转到”另一个函数）