CODEWITHSUNDEEP
jquery
Hari Krishna
Hari Krishna

Reputation: 3538

window.load is executing before document.ready

i am beginner to jquery. I am going through followng video tutorial. https://www.youtube.com/watch?v=l7JaPcGQYtk&list=PL6n9fhu94yhVDV697uvHpavA3K_eWGQap&spfreload=5

He mentioned, window.load executes after the DOM, images, css etc., are loaded and document.read() executes once the DOM is ready. So document.ready event always executes before window.load event. But when I tried following snippet, window.load is executing before document.ready. Can any one tell me, am I doing any mistake (or) is this is the expected behavior.

<!DOCTYPE html>
<html>
    <head>
        <title>window load vs document ready</title>
        <script src = "jquery-3.1.0.js"></script>
    </head>

    <body>
        <script type="text/javascript">
            var jq = jQuery.noConflict();

            jq(document).ready(function(){
                alert("Document is loaded");
            });

            jq(window).on("load", function(){
                alert("Window is ready");
            });

        </script>
    </body>
</html>

Upvotes: 3

Views: 2090

Answers (2)

Vishal
Vishal

Reputation: 11

<html>
<head>
    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript">
        window.onload = function() {
                alert('Window onload');
        };
        $(document).ready(function() {
            alert('document');
        });
    </script>
</head>
<body>
    <img src="a.jpg">
</body></html>

Hmm... .Using Jquery 3.3.1, I tried the above by adding an img tag and document.ready executes first. I may be wrong, but this makes me believe that when there are other tags, perhaps window.onload waits and $().ready fires first.Without the img tag, window.onload runs first...

Upvotes: 1

user3306013
user3306013

Reputation: 52

It seems some problem with JQuery 3.1.0 Tried it with 2.4 and 1.1 Its working as expected

Upvotes: 2

Related Questions