• Q&A
  • 회원가입
  • 로그인

[Event] JQ - $(document).ready() 메서드 ★ - 문서로드완료후 실행 (= ready메서드 = 다큐먼트레디 메서드 = 도큐먼트레디 이벤트)

411  
목차
  1. $(document).ready() 예제 - 문서 로딩 완료 후, 토글 허용
  2. $(document).ready() 정의
  3. $(document).ready() 구문

 

$(document).ready() 예제 - 문서 로딩 완료 후, 토글 허용

 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<script>

$(document).ready(function(){

  $("button").click(function(){

    $("p").slideToggle();

  });

});

</script>


<p>홈짱닷컴 Homzzang.com</p>


<button>숨기기/보이기 토글</button>

 

결과보기

 

$(document).ready() 정의

 

에러 안 나도록, 웹문서 모두 랜더링 된 이후에 제이쿼리 실행.  
더 자세히 보기

 


PS.

ready() 메서드는 현재 웹문서에서만 사용 가능하므로, 선택자 불필요.

즉, $(document)에 대해서만 사용 가능.

 


$(document).ready() 구문

[정식] - 직관적 이해 위해 이 방법 추천

$(document).ready(function(){
   // 실행코드
});
 

[약식] - 정식코드에서 핑크색 부분 생략한 방식

$(function(){
   // 실행코드
});

 

※ 거의 모든 제이쿼리 코드에서 사용되니 꼭 암기 !!



찾아주셔서 감사합니다. Since 2012