body onload işlevi Örneğimde (JavaScript) çalışmıyor

Nov 01 2020

Document.ready, window.onload, body.onload yürütme sırasını bulmak için bir program yazıyorum , ancak bazı nedenlerden dolayı body.onload, console.log vermiyor. Neden?

$(document).ready(function(){
    console.log('document is ready now ...');
});

window.onload = () => {
    console.log('window is loaded...');
}

function bodyOnload() {
    console.log('body is loaded...');
}
<html>

<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>

<body onload="bodyOnload()">

<h1>Hello ...</h1>

</body>

</html>

Yanıtlar

1 web-sudo Nov 02 2020 at 06:08

Size nedenini bazı örnek vakalarla anlatacağım ...

<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
    $(document).ready(function(){
        console.log('document is ready now ...');
    });

    window.onload = () => {
        console.log('window is loaded...');
    }

    function bodyOnload() {
        console.log('body is loaded...');
    }
</script>
</head>
<body onload="bodyOnload()">
<h1>Hello ...</h1>
</body>
</html>

Gördüğünüz gibi window.onload yukarıdaki durumda çalışmıyor. Ancak aşağıdaki durumda body.onload'un çalışmadığını görebilirsiniz.

<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body onload="bodyOnload()">
<h1>Hello ...</h1>
<script>
    $(document).ready(function(){
        console.log('document is ready now ...');
    });

    window.onload = () => {
        console.log('window is loaded...');
    }

    function bodyOnload() {
        console.log('body is loaded...');
    }
</script>
</body>
</html>

Yani ayrı yazsanız bile uyanmayacaktır. Genel olarak, bunlar birlikte çalışamaz. Neden? window.onload, gövdenin zaten yüklü olduğu ve body.onload ayrıca pencerenin zaten yüklü olduğu anlamına gelir. çünkü her ikisinden birinin çağrılması durumunda diğeri göz ardı edilecektir.