在Chrome扩展内容脚本中，我必须在处理文档之前等待document.ready吗？

Question

具体来说，我正在评估网页上的所有图片以查看它们是否具有某个属性，然后添加一些新的＆lt; divs＆gt;基于这些属性的DOM。为了确保Chrome已经加载了DOM的所有必要部分，我必须等待document.ready开始执行这些修改吗？

我遇到的问题是，有时document.ready需要一段时间才能触发并且用户已经在浏览页面，想知道为什么我的扩展程序还没有产生任何影响。这个问题通常只会持续一段时间，但这足以令人讨厌。

如果我不打扰等待document.ready，而是立即处理文档，那么的所有内容似乎都能正常工作;但我想知道我是不是很幸运。

Answer 1

实际上，你不必等待。您可以立即在Content Scripts处理。只需确保您未在​​document_start属性中使用run_at。

在document_end中，文件在DOM完成后立即注入，但在加载图像和帧之类的子资源之前。 document_idle（默认值）甚至更晚。

{
  "name": "My extension",
  ...
  "content_scripts": [
    {
      "matches": ["http://www.google.com/*"],
      "css": ["mystyles.css"],
      "js": ["jquery.js", "myscript.js"],
      "run_at": "document_end"
    }
  ],
  ...
}

Answer 2

简答：是的。

答案很长：jQuery将无法获取任何尚未呈现的DOM元素。我知道我已经遇到过几次麻烦了，调试一段时间然后意识到我忘记将代码包装在document.ready中会非常烦人。如果它为你工作，那是因为你的幸运。此外，如果您的脚本位于页面底部，就在您的结束体标记上方，则无需将其包装在document.ready中。