programing

jQuery - 여러 $(문서)입니다.준비됐어?

luckcodes 2022. 11. 7. 22:12

jQuery - 여러 $(문서)입니다.준비됐어?

질문:.

2개의 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.disc:

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

jquery2.disc:

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


양쪽의 콜을 1개의 콜로 간단하게 조합하는 것이 베스트 프랙티스라고 생각합니다.$(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()콜이 실제로 반환되어야 합니다.예외가 1개로 느려지면 후속(관련되지 않은) 콜은 실행되지 않습니다.

이것은 구문에 관계없이 적용됩니다.사용할 수 있습니다.jQuery(),jQuery(function() {}),$(document).ready()네가 뭘 좋아하든 행동은 똑같아초기 블록에 장애가 발생하면 후속 블록은 실행되지 않습니다.

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

$(표준)ready();는 다른 함수와 동일합니다.문서가 준비되면 실행됩니다(로드).문제는 $(복수)가 여러 개일 경우 어떻게 되는지에 대한 것입니다.ready()는 여러 $(filename) 내에서 동일한 함수를 실행했을 때 실행되지 않습니다.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달러(140원)만 사용합니다.ready();

//오래된 답변

둘 다 순서대로 부르겠습니다.베스트 프랙티스는 그것들을 결합하는 것이지만, 그것이 가능하지 않더라도 걱정하지 마세요.페이지가 폭발하지 않습니다.

실행은 하향식입니다.선착순입니다.

실행 시퀀스가 중요한 경우 결합합니다.

둘 다 부르면 선착순입니다.여기 좀 보세요.

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

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

출력:

Document-ready 2가 호출되었습니다!

스레드를 잘라내는 것이 아니라 최신 버전의jQuery권장되는 구문은 다음과 같습니다.

$( handler )

익명 기능을 사용하면 다음과 같이 보일 수 있습니다.

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

다음 링크를 참조하십시오.

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

언급URL : https://stackoverflow.com/questions/5263385/jquery-multiple-document-ready