Javascript Chrome扩展脚本有时在网页之前加载

我试图用我的chrome扩展将内容添加到网页上，但它需要完全加载网页，以便它能够解析出这些网页的HTML文档中特定属性的类名和ID。有时它可以工作，但有时，每当我在脚本中使用document.getElementsByCassName（）时，它会返回null而不是[object HtmlLevel]。我尝试在manifest.json的content\u scripts键中添加

“run\u at”：“document\u end”

，并在脚本顶部使用下面的代码，但脚本在网页上加载所有div元素之前一直运行。如何解决此问题？我所需要的就是在页面上所有HTML元素都被完全加载之后运行脚本。如果需要，我可以添加更多的代码，但我需要将项目的细节保密，这样我就不能添加比我已经发布的更多的代码

content.js：

if (document.readyState === 'loading') {  // Loading hasn't finished yet
  document.addEventListener('DOMContentLoaded', startExtension);
} else {  // `DOMContentLoaded` has already fired
  startExtension(); //Runs the rest of the script
}
function startExtension() {
  alert(document.getElementsByClassName("class_name"));
}

---

我找到了这个问题的答案。我使用了下面的代码，到目前为止，每次重新加载网页时它都能正常工作：

document.onreadystatechange = function () {
    if (document.readyState === 'complete') {
      startExtension();
    }
  }

---

您的代码片段令人困惑，您是否可以加载domcontents并删除外部条件？另外，请考虑您正在尝试执行的操作，如果readystate正在加载，请等待使用DOMContentLoaded加载内容，否则，只需启动扩展，但不要等待检查DOMContentLoaded是否已加载？另外，除了“加载”作为就绪状态外，还有其他状态，因此除了加载之外的任何其他状态都会在此时运行startextation（）。让我试着简化一下，我希望startExtension（）函数在HTML文档的所有属性完全加载后运行。如果在我的脚本运行之前它们还没有全部加载，那么对我要查找的对象之一调用document.getElementsByClassName（）将返回null。这不是每次都会发生，但大多数情况下都会发生，因此我需要找到一些方法在加载所有div标记和它们的子项后启动我的函数。我在上面的评论中为您提供了问题的答案。是的，在加载页面后它不会调用startExtension（）函数。是的，请尝试一下。我阅读了readyState，也可以看到您现在尝试执行的操作背后的逻辑。readyState完成后默认运行内容脚本，因此通常您不需要更改任何内容，也不需要您在问题中发布的原始代码（假设您没有使用“run\u at”：“document\u start”）。真正的解决方案是在

窗口

上侦听

加载

事件，或者简单的setTimeout/setInterval或MutationObserver。更多信息：在我加入我的答案中的代码之前，它是在网页完全加载之前运行脚本的，所以这是我需要的解决方案，它是有效的。它之所以有效，是因为这会产生额外的几乎零延迟，这在我的评论中已经提到。