포스팅을 보다보면 javascript의 DOMContentLoaded와 jQuery의 ready()가 동일하다고 설명되어있다.
결론부터 말하자면, 동일한 시점에 Trigger되는 것은 맞지만 이들의 작동방식에는 중요한 차이점이 있다.
document.addEventListeners('DOMContentLoaded', function () {})$(document).ready(function () {})
DOM이 준비되어 조작해도 되는 상태가 되면, ready()나 DOMContentLoaded가 호출 된다.
하지만 DOMContentLoaded의 경우 addListener를 한 시점이 이미 이벤트가 일어난 시점(DOM이 준비되어버린)인 경우에는 호출되지 않는다.
반면에, ready()의 경우에는 이미 ready()를 호출하기 이전에 DOMContentLoaded 이벤트가 일어났더라도, ready안의 function이 호출된다.
API 통신을 통해 동적으로 집어넣은 Script에 DOMContentLoaded가 작동안되는 이유는 바로 이것이다!
참고자료
'프로그래밍 > JS, Node.js' 카테고리의 다른 글
| 네이버 카페 댓글 사진 일괄 다운받는 방법 (0) | 2022.05.23 |
|---|---|
| [Javascript] Canvas 태양, 지구와 달 애니메이션 그리기 (Circle animation) (0) | 2022.01.11 |
| React JS 개념 잡기 - 빠르게 한 번 훑어보고 싶다면 (0) | 2021.01.08 |
| [Node.js] Selenium 사용법을 익혀보자 (11) | 2021.01.03 |
| [해결법] CasperJS: /usr/bin/env: ‘python’: No such file or directory (0) | 2021.01.03 |