javascript - Are there universal alternatives to window.onload without using frameworks? - Stack Overflow

admin管理员组

文章数量:1355697

In a previous question I learned of a bug in my JavaScript related to using appendChild on the BODY element before the DOMReady event was fired.

I was able to resolve this by wrapping my code in a window.onload event. Reading up on this, I have learned that window.onload only supports a single listener, and I can't guarantee I am not clobbering someone else's listener or that someone else's listener is not clobbering mine.

Looking at the source for $(document).ready(function(){});, I realize there is perhaps a lot that goes into the simplicity of that syntax.

Is there a universal way for me to wait for the DOMReady event without using jQuery or another JS library? While it seems like that would do the trick, I would prefer not to have any dependencies on a third party library in order for my code to work correctly.

In a previous question I learned of a bug in my JavaScript related to using appendChild on the BODY element before the DOMReady event was fired.

I was able to resolve this by wrapping my code in a window.onload event. Reading up on this, I have learned that window.onload only supports a single listener, and I can't guarantee I am not clobbering someone else's listener or that someone else's listener is not clobbering mine.

Looking at the source for $(document).ready(function(){});, I realize there is perhaps a lot that goes into the simplicity of that syntax.

Is there a universal way for me to wait for the DOMReady event without using jQuery or another JS library? While it seems like that would do the trick, I would prefer not to have any dependencies on a third party library in order for my code to work correctly.

• javascript
• jquery
• onload

Share Improve this question Follow edited May 23, 2017 at 10:27 CommunityBot 111 silver badge asked Jun 8, 2011 at 21:25 buleybuley 29.3k1818 gold badges8888 silver badges108108 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 6

You can do something like:

function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      if (oldonload) {
        oldonload();
      }
      func();
    }
  }
}

addLoadEvent(nameOfSomeFunctionToRunOnPageLoad);
addLoadEvent(function() {
  /* more code to run on page load */
});

which wraps the existing onload in a new function with an additional function. This is taken from http://www.webreference./programming/javascript/onloads/

However, for doing it on document ready and not onload (different things, onload is when everything is downloaded where ready is when the document are loaded) look at this question: $(document).ready equivalent without jQuery

You can use:

document.onpageshow= new function() {
//(Code here)
}

You can also replace "onpageshow" with "onload" for better patibility.

This may also be helpful: https://developer.mozilla/en/DOM/element.addEventListener

本文标签： javascriptAre there universal alternatives to windowonload without using frameworksStack Overflow