События jQuery .load (), .ready (), .unload ()

Question

Просто простой вопрос для события jQuery. Работают ли .load (), .ready () и .unload () по порядку при загрузке DOM? Ответ кажется да, когда я вижу документацию jQuery.

<script type="text/javascript">

    $(window).load(function () {
        // run code
        initializeCode();
    });

    $(document).ready(function() {
        //run code that MUST be after initialize
    });

    $(window).unload(function() {
        Cleanup();
    });
</script>

Однако код внутри .ready () выполняется перед initializeCode (); это выполнить, поэтому я чувствую себя действительно странно. И теперь я должен поместить свой код в метод .onload () и сразу после initializeCode (); строка, которая означает быть внутри блока .ready ().

Может ли кто-нибудь объяснить мне больше об этом, так как я новичок в jQuery?

Answer 1

ПРИМЕЧАНИЕ: .load() & .unload() были устарели

---

$(window).load();

Запустится после загрузки страницы вместе со всем ее содержимым. Это означает, что все изображения, CSS (и контент, определенный CSS, такой как пользовательские шрифты и изображения), сценарии и т. Д. Загружены. Это происходит, когда событие запускается, когда иконка браузера «Стоп» становится серой, так сказать. Это очень полезно для определения момента загрузки документа вместе со всем его содержимым.

$(document).ready();

Это, с другой стороны, сработает, как только веб-браузер сможет запустить ваш JavaScript, что происходит после того, как анализатор завершил работу с DOM. Это полезно, если вы хотите выполнить JavaScript как можно скорее.

$(window).unload();

Это событие будет срабатывать при переходе со страницы. Это может быть Refresh / F5, нажатие кнопки предыдущей страницы, переход на другой веб-сайт или закрытие всей вкладки / окна.

Подводя итог, можно сказать, что ready () будет запущен до load (), а unload () будет запущен последним.

Answer 2

окно загрузки будет ожидать загрузки всех ресурсов.

документ готов ожидает инициализации документа.

хорошо выгружается, ждет, пока документ выгружается.

Порядок: документ готов, загрузка окна, ... ... ... ... выгрузка окна.

всегда используйте готовый документ , если только вам не нужно ждать загрузки изображений.

сокращение для готового документа:

$(function(){
    // yay!
});

Answer 3

Если используются оба варианта «document.ready», они оба будут запускаться в порядке появления

$(function(){
    alert('shorthand document.ready');
});

//try changing places
$(document).ready(function(){
    alert('document.ready');
});

Answer 4

Также я заметил еще одну разницу между .load и .ready. Я открываю дочернее окно и выполняю некоторую работу, когда открывается дочернее окно. .load вызывается только в первый раз, когда я открываю окно, и если я не закрываю окно, то .load больше не будет вызываться. однако, .ready вызывается каждый раз, независимо от того, закрыто ли дочернее окно или нет.