The top Google hit for javascript addeventlistener load was jQuery based and therefore not relevant to me, I want a clean reference of how to best bind an event to a document's ready state in vanilla JavaScript.
            Asked
            
        
        
            Active
            
        
            Viewed 1,295 times
        
    0
            
            
        - 
                    If you want to see exactly how to use the `readyState` to know when the DOM is ready in plain javascript across many different generations of browsers, see this answer which has a ready to use function that uses the `readyState` and the `DOMContentLoaded` event: http://stackoverflow.com/questions/9899372/pure-javascript-equivalent-to-jquerys-ready-how-to-call-a-function-when-the/9899701#9899701 – jfriend00 Apr 17 '14 at 03:59
- 
                    Thank you jsfriend00, and indeed everyone else who has posted on this thread. I'm excited to know there are so many colorful variants! – ThorSummoner Apr 17 '14 at 04:21
2 Answers
2
            
            
        how to best bind an event to a document's ready state
That would probably be...
document.addEventListener("DOMContentLoaded", function() { });
 
    
    
        alex
        
- 479,566
- 201
- 878
- 984
0
            
            
        MDN's Reference for Events show the load event being the desired trigger. This post explains not to bind to the document node, rather to bind to the window node.
window.addEventListener('load', function(){ console.log('document ready!'); });
 
    
    
        Community
        
- 1
- 1
 
    
    
        ThorSummoner
        
- 16,657
- 15
- 135
- 147
- 
                    That's a different event to *document ready*. I'd call that *all stuff has downloaded*. – alex Apr 17 '14 at 03:54
