`$(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()` 함수 내에 여러 코드 블록을 포함시키는 것이 좋습니다.
'게으른 개발자의 끄적거림' 카테고리의 다른 글
DB Connection Pool 이란? (0) | 2023.10.05 |
---|---|
[JavaScript] onclick 이벤트 여러개 (0) | 2023.10.04 |
어필리에이트 신청 방법(쿠팡, 알리익스프레스 등등) (0) | 2023.09.25 |
JavaScript button 클릭시 닫기 이벤트 (0) | 2023.09.21 |
window.location 기능 (host, ip, hash...) (0) | 2023.09.20 |