Question

我正在编写一个需要检查DOM中元素的chrome扩展。我目前正在尝试解决在document.onload触发后将脚本添加到DOM的情况，并且这些脚本会向DOM添加更多元素，我想查看这些元素。有时元素位于子帧中，有时脚本会将其添加document.write。是的，我知道，我知道。

目前的主要问题似乎是我无法检测脚本是否已经加载。如果没有加载，我可以安全地将监听器附加到script.onload，但如果已经加载了，则onload将无法启动。

在其他几个地方，我会检查readyState以查看文档是否已准备就绪。如果是，我执行我的代码，如果不是，我附加一个onload监听器。但是，尽管在几个SO答案中引用了这样的属性，但Chrome中的异步脚本似乎没有readyState。

那么有没有办法弄清楚是否已经加载了异步脚本？由于这是特定于Chrome的，因此不需要跨浏览器兼容。有没有办法使用MutationObserver可靠地附加每个脚本的onload侦听器并手动跟踪其状态？

谢谢！

Answer 1

要检测DOM上加载的脚本，请检索所有脚本标记：

document.querySelectorAll('script');

这将返回在DOM上加载的脚本数组。在数组上调用.length将显示加载了多少脚本。你可以通过他们的.src或其他属性引用这些脚本来做一些事情，比如获取他们的孩子或兄弟元素。