[removed] vs <body onload=“”/>

后端 未结 13 1773
盖世英雄少女心
盖世英雄少女心 2020-11-22 13:45

What exactly is the difference between the window.onload event and the onload event of the body tag? when do I use which and how shoul

相关标签:
13条回答
  • 2020-11-22 14:19

    Think of onload like any other attribute. On an input box, for example, you could put:

    <input id="test1" value="something"/>
    

    Or you could call:

    document.getElementById('test1').value = "somethingelse";
    

    The onload attribute works the same way, except that it takes a function as its value instead of a string like the value attribute does. That also explains why you can "only use one of them" - calling window.onload reassigns the value of the onload attribute for the body tag.

    Also, like others here are saying, usually it is cleaner to keep style and javascript separated from the content of the page, which is why most people advise to use window.onload or like jQuery's ready function.

    0 讨论(0)
  • 2020-11-22 14:23

    window.onload = myOnloadFunc and <body onload="myOnloadFunc();"> are different ways of using the same event. Using window.onload is less obtrusive though - it takes your JavaScript out of the HTML.

    All of the common JavaScript libraries, Prototype, ExtJS, Dojo, JQuery, YUI, etc. provide nice wrappers around events that occur as the document is loaded. You can listen for the window onLoad event, and react to that, but onLoad is not fired until all resources have been downloaded, so your event handler won't be executed until that last huge image has been fetched. In some cases that's exactly what you want, in others you might find that listening for when the DOM is ready is more appropriate - this event is similar to onLoad but fires without waiting for images, etc. to download.

    0 讨论(0)
  • 2020-11-22 14:25

    window.onload - Called after all DOM, JS files, Images, Iframes, Extensions and others completely loaded. This is equal to $(window).load(function() {});

    body onload="" - Called once DOM loaded. This is equal to $(document).ready(function() {});

    0 讨论(0)
  • 2020-11-22 14:28

    If you're trying to write unobtrusive JS code (and you should be), then you shouldn't use <body onload="">.

    It is my understanding that different browsers handle these two slightly differently but they operate similarly. In most browsers, if you define both, one will be ignored.

    0 讨论(0)
  • 2020-11-22 14:29

    There is no difference ...

    So principially you could use both (one at a time !-)

    But for the sake of readability and for the cleanliness of the html-code I always prefer the window.onload !o]

    0 讨论(0)
  • 2020-11-22 14:31

    There is no difference, but you should not use either.

    In many browsers, the window.onload event is not triggered until all images have loaded, which is not what you want. Standards based browsers have an event called DOMContentLoaded which fires earlier, but it is not supported by IE (at the time of writing this answer). I'd recommend using a javascript library which supports a cross browser DOMContentLoaded feature, or finding a well written function you can use. jQuery's $(document).ready(), is a good example.

    0 讨论(0)
提交回复
热议问题