Подтвердить что ты не робот

Как узнать, когда страница готова без использования jQuery (альтернативный способ)?

Возможный дубликат:
$(document).ready эквивалент без jQuery

Если на вашей странице вызывается jQuery. Вы можете просто сделать это:

$(document).ready(function() { /** code inside **/});

Но как делать подобное без jQuery?

Ответ 1

Вы можете использовать событие DOMContentLoaded.

document.addEventListener('DOMContentLoaded', function() {
   // ...
});

Обратите внимание, что в старых IE вам нужны обходные пути, некоторые используют событие readystatechange, если я правильно помню.

Ответ 2

Я думаю, что самый простой способ ответить на ваш вопрос - ответить "Как это делает jQuery?" и для этого я бы рекомендовал искать исходный код. Наиболее важная часть кода https://github.com/jquery/jquery/blob/master/src/core.js#L423

Вот фрагмент:

// 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();
    }
}

Ответ 3

window.onload = function(){
 // do something
}

Ответ 4

Используйте ниже script:

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

window.onload=funtionToBeCalled;
</script>

Или есть еще один способ. Добавить событие onload в теге body, как показано ниже:

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