In a Chrome Extension content script, must I wait for document.ready before processing the document?

Question

Specifically, I\'m evaluating all of the images on a page to see if they have a certain attribute, and then adding some new to the DOM based on those attributes

Answer 1

Actually, you don't have to wait. You can process right away in Content Scripts. Just make sure you don't use document_start in the run_at attribute.

In document_end, the files are injected immediately after the DOM is complete, but before subresources like images and frames have loaded. document_idle (the default value) happens even later.

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

Answer 2

Short answer: yes.

Long answer: jQuery won't be able to grab any DOM elements that aren't already rendered. I know i've gotten into trouble a few times and it can be quite annoying to debug something for awhile and then realize I forgot to wrap the code in a document.ready. If its working for you, it's because your lucky. Also, you dont need to wrap it in a document.ready if your scripts are at the bottom of your page, just above your closing body tag.