dojo dom manipulation after page load

Question

I think this question is asked, but I am surprised to see that dojo is not behaving as per the docs. I want some div to be changed with particular class. So I decided to use

dojo.ready(function(){
});

But that was running before the page was completely loaded. Then I used addonload() function. That too gave the same result. Finally I ended up doing something like this

require(["dojo/domReady"], function(domReady) {
    domReady(function () {
        setTimeout(function(){
            setAfrobeat();
            },500); 
    });
});

That is working fine, but some times I see a blink as there is delay, and very a few times this also doesn't work. If I increase that timeout to 1000 it works always, but user can see the content modification. Any perfect way like I used to do in jquery's document.ready

Regards

Aadam

Answer 1

The way you are loading domReady is as a typical module instead of as a dojo plugin with the "!" convention as per the dojo documentation http://dojotoolkit.org/documentation/tutorials/1.8/modules/ see using plugins.

To use domReady correctly it should look like this..

require(["dojo/domReady!"], function(){
   // will not run until DOM is finished loading

 });

http://dojotoolkit.org/reference-guide/1.10/dojo/domReady.html outlines when and how to use dojo/domReady! vs dojo/ready