언제 jQuery의 document.ready 기능을 사용해야합니까?

해결법

1.간단하게 말하면,

간단하게 말하면,

당신은 머리 섹션에서 jQuery 코드를 배치 있다고 가정하고, DOM 요소 (앵커, IMG 등)에 액세스하려고하는 것은, 당신이 위에서 아래로 해석됩니다 그것은 HTML 때문에 액세스 할 수 없습니다 당신의 HTML 요소 때 존재하지 않는 당신의 jQuery 코드가 실행됩니다.

이 문제를 극복하기 위해, 우리는 모든 DOM 요소에 액세스 할 수있을 때 호출되는 $ 내부 (DOM을 사용하여) 모든 jQuery를 / 자바 스크립트 코드 (문서) .ready 기능을 배치합니다.

당신이 (직전 , 모든 DOM 요소 후) 하단에 jQuery 코드를 배치 할 때 그리고이 이유입니다, $ (문서) .ready에 대한 필요가 없습니다

당신 때문에 내가 위에서 설명한 같은 이유로 문서에 방법에 사용 .ready 만 $ (문서) 내부의 방법에 위치 할 필요가 없다.
```
    //No need to be put inside $(document).ready
    $(document).on('click','a',function () {
    })

    // Need to be put inside $(document).ready if placed inside <head></head>
    $('.container').on('click','a',function () {
    });
```
편집하다

의견에서,
2.대답:

대답:

아니, 항상. 문서 헤드에 JS를로드 할 경우 다음을 수행해야합니다. 당신이 AJAX를 통해 페이지가로드 한 후 요소를 작성하는 경우에 필요합니다. 당신은 스크립트가 너무 핸들러를 추가하는 html 요소 미만인 경우에 필요하지 않습니다.

때에 따라 다르지. 당신이 페이지가 로딩이 그대로 즉시 발생 할 경우는 그냥 따라, 핸들러를 연결하는 동일한 시간이 걸릴 것 또는 당신이 원하는 경우 전체 문서가로드 될 때까지 기다려야. 그래서 당신이 페이지에하고있는 어떤 다른 것들 따라 달라집니다.

그것은 본질적으로 그것은에만 액세스가 글로벌 범위에서 선언 바르 할 수 있도록 자신의 기능 (외부 / 모든 기능 이상)의 나 window.myvarname와 = '';
3.안전하게 jQuery를 사용하기 전에 당신은 페이지가 조작 할 준비가 상태에 있는지 확인해야합니다. jQuery를, 우리는 .ready $ (문서)에 해당 기능을 함수에 우리의 코드를 넣어, 다음 전달하여이를 (). 함수 우리의 패스는 익명 함수가 될 수 있습니다.

안전하게 jQuery를 사용하기 전에 당신은 페이지가 조작 할 준비가 상태에 있는지 확인해야합니다. jQuery를, 우리는 .ready $ (문서)에 해당 기능을 함수에 우리의 코드를 넣어, 다음 전달하여이를 (). 함수 우리의 패스는 익명 함수가 될 수 있습니다.
```
$(document).ready(function() {  
    console.log('ready!');  
});
```
이것은 우리가 문서가 준비되면 () .ready에 전달하는 기능을 실행합니다. 여기 무슨 일이야? 우리는 우리의 페이지의 문서에서의 jQuery 객체를 생성 $ (문서)를 사용하고 그것을 우리가 실행하려는 기능을 전달하는 객체에 .ready () 함수를 호출하고 있습니다.

이것은 당신 자신이 많은 일을 찾을 일이 있기 때문에 당신이 원하는 경우, 이에 대한 속기 방법있다 - $ () 함수는 당신이 그것을 함수를 전달하면 .ready $ (문서) ()의 별칭으로 이중 임무를 수행합니다
```
$(function() {  
    console.log('ready!');  
});  
```
이것은 좋은 읽기입니다 : jQuery를 기본
4..ready () - DOM을 완전히로드 될 때 실행하는 기능을 지정합니다.

.ready () - DOM을 완전히로드 될 때 실행하는 기능을 지정합니다.
```
$(document).ready(function() {
  // Handler for .ready() called.
});
```
여기에 모든 jQuery를 방법의 목록입니다

() .ready $ (문서) 소개에 읽기
5.현실적으로, document.ready은 어떤 곳보다 정확하게 DOM을 조작하기위한 필요하지 않습니다 그것은 항상 필요하지 나 최선의 선택. 내가 평균 당신이 개발할 때 당신이 그것을 건조 유지하기 위해 노력하고 있기 때문에 가능한 한 DOM을 조작하지만, 호출하기위한 것입니다 방법에 추상적 인 당신은 그래서 큰 jQuery를 플러그인 예를 들어 당신이 거의 코드를 통해 그것을 사용하지 않는다는 것이다 나중에. 모든 코드가 단단히 일반적으로 init이있다 document.ready에 노출되는 유일한 방법을 통합하면 모든 DOM 마법이 일어나는 곳. 이 질문에 대한 답변이 되었기를 바랍니다.

현실적으로, document.ready은 어떤 곳보다 정확하게 DOM을 조작하기위한 필요하지 않습니다 그것은 항상 필요하지 나 최선의 선택. 내가 평균 당신이 개발할 때 당신이 그것을 건조 유지하기 위해 노력하고 있기 때문에 가능한 한 DOM을 조작하지만, 호출하기위한 것입니다 방법에 추상적 인 당신은 그래서 큰 jQuery를 플러그인 예를 들어 당신이 거의 코드를 통해 그것을 사용하지 않는다는 것이다 나중에. 모든 코드가 단단히 일반적으로 init이있다 document.ready에 노출되는 유일한 방법을 통합하면 모든 DOM 마법이 일어나는 곳. 이 질문에 대한 답변이 되었기를 바랍니다.
6.문서가 완전히로드 될 때까지 기다려야해야하기 때문에 당신은 document.ready에서 모든 작업을 결합해야한다.

문서가 완전히로드 될 때까지 기다려야해야하기 때문에 당신은 document.ready에서 모든 작업을 결합해야한다.

그러나, 당신은 모든 행동에 대한 기능을 작성하고 document.ready 내에서 호출해야합니다. 이 기능 (글로벌 객체)를 만들 때 당신이 원하는 때마다, 그들에게 전화. 새 데이터가로드되고 새로운 요소가 생성되면 그래서, 다시 그 함수를 호출.

이 기능을 사용하면 이벤트 및 작업 항목을 바인딩 한 것들입니다.
```
$(document).ready(function(){
bindelement1();
bindelement2();
});

function bindelement1(){
$('el1').on('click',function...);
//you might make an ajax call here, then under complete of the AJAX, call this function or any other function again
}

function bindelement2(){
$('el2').on('click',function...);
}
```
7.전 사업부에 대한 링크를 추가하고 클릭에 대한 몇 가지 작업을하고 싶었다. 나는 DOM에 첨부 된 요소 아래의 코드를 추가했지만 작동하지 않았다. 여기에 코드입니다 :

전 사업부에 대한 링크를 추가하고 클릭에 대한 몇 가지 작업을하고 싶었다. 나는 DOM에 첨부 된 요소 아래의 코드를 추가했지만 작동하지 않았다. 여기에 코드입니다 :
```
<div id="advance-search">
   Some other DOM elements
   
</div>

<script>
  $("#advance-search #reset-adv-srch").on("click", function (){
     alert('Link Clicked');``
  });
</script>
```
그것은 작동하지 않았다. 그럼 난 $ (문서) .ready 내부의 jQuery 코드를 배치하고 완벽하게 일했다. 여기있어.
```
$(document).ready(function(e) {
    $("#advance-search #reset-adv-srch").on("click", function (){
        alert('Link Clicked');
    });
});
```
8.는 DOM (문서 객체 모델)이로드되었을 때 그는 준비가 이벤트가 발생합니다.

는 DOM (문서 객체 모델)이로드되었을 때 그는 준비가 이벤트가 발생합니다.

문서가 준비 후이 이벤트가 발생하기 때문에, 다른 모든 jQuery를 이벤트와 기능을 가지고있는 좋은 장소입니다. 위의 예처럼.

준비 이벤트가 발생하면 준비 () 메소드를 지정 무슨.

팁 : 준비 () 메소드와 함께 사용해서는 안됩니다.

from https://stackoverflow.com/questions/13062246/when-should-i-use-jquerys-document-ready-function by cc-by-sa and MIT license

'JQUERY' 카테고리의 다른 글

[JQUERY] iframe이 만 페이지의 특정 부분을 표시합니다 (0)	2020.10.08
[JQUERY] asp.net MVC에서 컨트롤러에 대한 간단한 Ajax 호출 만들기 (0)	2020.10.08
[JQUERY] $ 아약스 - dataType와 (0)	2020.10.08
[JQUERY] 그것은 선택 상자 스타일 수 있습니까? [닫은] (0)	2020.10.08
[JQUERY] HTML 요소는 jQuery를 사용하여 비어있는 경우 어떻게 확인합니까? (0)	2020.10.08

복붙노트

[JQUERY] 언제 jQuery의 document.ready 기능을 사용해야합니까?

언제 jQuery의 document.ready 기능을 사용해야합니까?

해결법

1.간단하게 말하면,

2.대답:

4..ready () - DOM을 완전히로드 될 때 실행하는 기능을 지정합니다.

6.문서가 완전히로드 될 때까지 기다려야해야하기 때문에 당신은 document.ready에서 모든 작업을 결합해야한다.

7.전 사업부에 대한 링크를 추가하고 클릭에 대한 몇 가지 작업을하고 싶었다. 나는 DOM에 첨부 된 요소 아래의 코드를 추가했지만 작동하지 않았다. 여기에 코드입니다 :

8.는 DOM (문서 객체 모델)이로드되었을 때 그는 준비가 이벤트가 발생합니다.

'JQUERY' 카테고리의 다른 글

티스토리툴바