[javascript] jQuery-여러 $ (문서) .ready…?

JAVASCRIPT / 글쓴이

질문:

$(document).ready함수 와 함께 두 개의 JavaScript 파일로 링크하면 어떻게됩니까? 하나는 다른 하나를 덮어 쓰나요? 아니면 둘 다 $(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이지만 내 상황에서는 불가능합니다.

답변

모든 사람이 처형 되고 첫 선착순으로 선발됩니다 !!

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

답변

각 jQuery()통화는 실제로 응답해야합니다. 하나에서 예외가 발생하면 후속 (관련되지 않은) 호출은 절대 실행되지 않습니다.

이것은 구문에 관계없이 적용됩니다. 당신이 사용할 수있는 jQuery(), jQuery(function() {}), $(document).ready(), 당신이 원하는대로, 동작은 동일합니다. 초기 블록이 실패하면 후속 블록이 실행되지 않습니다.

타사 라이브러리를 사용할 때 문제가되었습니다. 한 라이브러리에서 예외가 발생했으며 후속 라이브러리는 아무것도 초기화하지 않았습니다.

답변

$ (문서) .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 초의 빠른 속도로 실행되며 타이핑이 덜 필요합니다. 🙂

결론적으로 가능하면 1 $ (document) .ready ();

// 이전 답변

둘 다 순서대로 호출됩니다. 가장 좋은 방법은 그것들을 결합하는 것입니다. 그러나 가능하지 않은 경우 걱정하지 마십시오. 페이지가 폭발하지 않습니다.

답변

실행은 하향식입니다. 먼저 왔어요.

실행 순서가 중요한 경우 조합하십시오.

답변

둘 다 호출 될 것이며, 먼저 제공 될 것입니다. 봐 여기 .

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

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

산출:

문서 준비 2가 호출되었습니다!

답변

스레드를 괴롭히지 말고 jQuery제안 된 구문 의 최신 버전에서는 다음과 같습니다.

$( handler )

익명 함수를 사용하면 다음과 같습니다.

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

이 링크를보십시오 :

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

답변