How to know when page is ready without using jQuery (alternative way)? [duplicate]

后端未结

关注

 4  725

悲&欢浪女

相关标签:

4条回答

-上瘾入骨i

2020-12-24 12:21
You can use the DOMContentLoaded event.
```
document.addEventListener('DOMContentLoaded', function() {
   // ...
});
```
Note that in older IEs you need workarounds, some use the readystatechange event if I recall correctly.
0 讨论(0)
发布评论:

提交评论
- 加载中...
星月不相逢

2020-12-24 12:25
```
window.onload = function(){
 // do something
}
```
0 讨论(0)
发布评论:

提交评论
- 加载中...

慢半拍i

2020-12-24 12:30

Use below script:

<script type="text/JavaScript">
function funtionToBeCalled(){
// code that will be exected after dom ready
}

window.onload=funtionToBeCalled;
</script>

Or there is one more way. Add onload event in body tag as below:

<body onload='functionToBeCalled();'>
</body>

0 讨论(0)

梦谈多话

2020-12-24 12:32

I think the simplest way to answer your question is to answer "How does jQuery do it?" and for that, I'd recommend looking as the source code. The most relevant part of the code is at https://github.com/jquery/jquery/blob/master/src/core.js#L423

Here's a snippet:

// Catch cases where $(document).ready() is called after the
// browser event has already occurred.
if ( document.readyState === "complete" ) {
    // Handle it asynchronously to allow scripts the opportunity to delay ready
    return setTimeout( jQuery.ready, 1 );
}

// Mozilla, Opera and webkit nightlies currently support this event
if ( document.addEventListener ) {
    // Use the handy event callback
    document.addEventListener( "DOMContentLoaded", DOMContentLoaded, false );

    // A fallback to window.onload, that will always work
    window.addEventListener( "load", jQuery.ready, false );

// If IE event model is used
} else if ( document.attachEvent ) {
    // ensure firing before onload,
    // maybe late but safe also for iframes
    document.attachEvent( "onreadystatechange", DOMContentLoaded );

    // A fallback to window.onload, that will always work
    window.attachEvent( "onload", jQuery.ready );

    // If IE and not a frame
    // continually check to see if the document is ready
    var toplevel = false;

    try {
        toplevel = window.frameElement == null;
    } catch(e) {}

    if ( document.documentElement.doScroll && toplevel ) {
        doScrollCheck();
    }
}

0 讨论(0)

热议问题