게으른 개발자의 끄적거림

$(document).ready 여러개 사용

끄적잉 2023. 9. 26. 22:11
728x90

 `$(document).ready()` 함수는 jQuery에서 사용되는 이벤트 핸들러 중 하나로, HTML 문서가 로드되면 실행되는 코드 블록을 정의하는 데 사용됩니다. 이를 이용하여 웹 페이지의 요소들이 완전히 로드된 후에 JavaScript 코드를 실행할 수 있습니다.

 

 


1. 단일 `$(document).ready()` 사용
   

   $(document).ready(function() {
     // 코드 블록 1
   });

   $(document).ready(function() {
     // 코드 블록 2
   });
 


   위의 코드에서 `$(document).ready()` 함수를 여러 번 사용하더라도, 각 코드 블록은 문서가 준비되면 순차적으로 실행됩니다. 먼저 코드 블록 1이 실행되고, 그 다음에 코드 블록 2가 실행됩니다

 

 

 

 

 

2. 하나의 `$(document).ready()` 안에 여러 코드 블록 사용

 

   $(document).ready(function() {
     // 코드 블록 1
     // 코드 블록 2
   });

 


   이 경우에는 하나의 `$(document).ready()` 함수 내에서 여러 코드 블록을 사용하는 것이므로, 문서가 준비되면 코드 블록 1과 코드 블록 2가 차례로 실행됩니다.

 

 

 

 


3. 단일 `$(document).ready()` 함수에 여러 이벤트 핸들러 추가
   
   $(document).ready(function() {
     // 코드 블록 1
   });

   $(document).ready(function() {
     // 코드 블록 2
   });
  

 

   위의 예에서처럼 여러 개의 `$(document).ready()` 함수를 사용하는 것은 일반적으로 코드의 가독성을 떨어뜨릴 수 있으므로 권장되지는 않습니다. 대신, 하나의 `$(document).ready()` 함수 내에서 여러 코드 블록을 작성하여 코드를 구성하는 것이 더 깔끔하며 유지 보수하기 쉽습니다.

 

 


종합적으로, `$(document).ready()` 함수는 문서가 준비되었을 때 코드를 실행하도록 하며, 여러 번 사용하더라도 각각의 코드 블록은 순차적으로 실행됩니다. 하지만 코드를 더 간결하게 작성하기 위해 하나의 `$(document).ready()` 함수 내에 여러 코드 블록을 포함시키는 것이 좋습니다.

728x90