jQuery - несколько $ (документ) .ready ...?

Question

Вопрос:

Если я свяжу два файла JavaScript, оба с функциями $(document).ready, что произойдет?Один перезаписывает другой?Или оба $(document).ready будут вызваны?

Например,

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>

<script type="text/javascript" src="http://.../jquery1.js"></script>

<script type="text/javascript" src="http://.../jquery2.js"></script>

jquery1.js:

$(document).ready(function(){
    $("#page-title").html("Document-ready was called!");
});

jquery2.js:

$(document).ready(function(){
    $("#page-subtitle").html("Document-ready was called!");
});

Я уверен, что лучше всего объединить оба вызова в один $(document).ready, но в моей ситуации это не совсем возможно.

Answer 1

Все будет выполнено и при первом вызове при первом запуске !!

<div id="target"></div>

<script>
  $(document).ready(function(){
    jQuery('#target').append('target edit 1<br>');
  });
  $(document).ready(function(){
    jQuery('#target').append('target edit 2<br>');
  });
  $(document).ready(function(){
    jQuery('#target').append('target edit 3<br>');
  });
</script>

Демо Как видите, они не заменяют друг друга

Также одну вещь, которую я хотел бы упомянуть

вместо этого

$(document).ready(function(){});

, вы можете использовать этот ярлык

jQuery(function(){
   //dom ready codes
});

Answer 2

Важно отметить, что каждый вызов jQuery() должен действительно возвращаться.Если исключение выдается в одном, последующие (несвязанные) вызовы никогда не будут выполнены.

Это применяется независимо от синтаксиса.Вы можете использовать jQuery(), jQuery(function() {}), $(document).ready(), что угодно, поведение одинаковое.Если ранний сбой, последующие блоки никогда не будут запущены.

Это было проблемой для меня при использовании сторонних библиотек.Одна библиотека генерировала исключение, а последующие библиотеки никогда ничего не инициализировали.

Answer 3

$ (документ) .ready (); такой же, как и любая другая функция. он срабатывает, когда документ готов - т.е. загружен. вопрос в том, что происходит, когда несколько $ (document) .ready () запускаются не тогда, когда вы запускаете одну и ту же функцию в нескольких $ (document) .ready ()

//this
<div id="target"></div>

$(document).ready(function(){
   jQuery('#target').append('target edit 1<br>');
});
$(document).ready(function(){
   jQuery('#target').append('target edit 2<br>');
});
$(document).ready(function(){
   jQuery('#target').append('target edit 3<br>');
});

//is the same as
<div id="target"></div>

$(document).ready(function(){

    jQuery('#target').append('target edit 1<br>');

    jQuery('#target').append('target edit 2<br>');

    jQuery('#target').append('target edit 3<br>');

});

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

В заключение, где только возможно, используйте только 1 $ (документ) .ready ();

// старый ответ

Они оба будут вызваны по порядку. Лучшей практикой было бы объединить их. но не волнуйтесь, если это невозможно. страница не взорвется.

Answer 4

Исполнение сверху вниз.Сначала пришел, первым обслужен.

Если важна последовательность выполнения, объедините их.

Answer 5

Оба будут вызваны, первым пришел, первым обслужен.Взгляните здесь .

$(document).ready(function(){
    $("#page-title").html("Document-ready was called!");
  });

$(document).ready(function(){
    $("#page-title").html("Document-ready 2 was called!");
  });

Вывод:

Документ готов к 2 вызван!

Answer 6

Не для того, чтобы некрозить поток, но в последней версии jQuery предлагается следующий синтаксис:

$( handler )

При использовании анонимной функции это будет выглядеть как

$(function() { ... insert code here ... });

Смотрите эту ссылку:

https://api.jquery.com/ready/