Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

document.readystate of "interactive" vs. ondomcontentloaded?

Could anyone tell me the difference between the "interactive" state of document.readyState and "DOMContentLoaded"?

I couldn't find a lot of info on the "interactive" state and what specifically is available to be used in the page.

This page says:

interactive - Has loaded enough and the user can interact with it

Which seems a helluva lot like the DOMContentLoaded event.

I wrote a quick test page here which seems to suggest that the interactive readystate seems to be available before the DOMContentLoaded event.

So could someone clarify or give me some info on whats available to be manipulated on the page in the interactive state and whether it is the same as DOMContentLoaded and if so, why is it available before DOMContentLoaded?

:)

Cheers, Yansky.

Edit: forgot to add, you need to be running FF4b to be able to use/see the new readystate feature.

like image 372
Yansky Avatar asked Sep 08 '10 07:09

Yansky


2 Answers

Once the user agent stops parsing the document, the user agent must run the following steps:

  1. Set the current document readiness to "interactive" and the insertion point to undefined.

  2. Pop all the nodes off the stack of open elements.

  3. If the list of scripts that will execute when the document has finished parsing is not empty, run these substeps:

    a. Spin the event loop until the first script in the list of scripts that will execute when the document has finished parsing has its "ready to be parser-executed" flag set and the parser's Document has no style sheet that is blocking scripts.

    b. Execute the first script in the list of scripts that will execute when the document has finished parsing.

    c. Remove the first script element from the list of scripts that will execute when the document has finished parsing (i.e. shift out the first entry in the list).

    d. If the list of scripts that will execute when the document has finished parsing is still not empty, repeat these substeps again from substep a.

  4. Queue a task to fire a simple event that bubbles named DOMContentLoaded at the Document. . . . https://www.w3.org/TR/html5/syntax.html#the-end

like image 183
Yaniv Shemesh Avatar answered Oct 21 '22 18:10

Yaniv Shemesh


Just to answer my own question here, it seems that the DOMContentLoaded event equates to the document.interactive readystate.

like image 29
Yansky Avatar answered Oct 21 '22 18:10

Yansky