[Javascript]문서 로딩

위 코드의 콘솔 결과값은 NULL이다.

그 이유는 <p>태그가 나오기도 이전에 엘리먼트 값을 얻으려고 하기 때문이다.

즉 순서의 문제이다.

이 경우에 보통에는 바디태그 아래 혹은 모든 엘리먼트들이 다 입력 된 후 마지막에 script를 입력하면 된다.

하지만 onload메소드를 이용하면 이 문제를 위치 변경 없이 해결 할 수 있다.

다음과 같이 window객체의 속성인 onload를 이용하여 엘리먼트를 불러 들였다.

다음은 이벤트 리스너 방식

위의 두 예시의 문제점은

onload , load는 모든 HTML문서의 작업이 끝나고 나서야 실행된다는 것인데,

이는 이미지 다운로드와 같은 오래 걸리는 동작까지 기다려야 한다는 점이다.

그럴 때 DOMContentLoaded를 이용하면 쉽게 문제를 해결 할 수 있다.

이는 오로지 태그가 준비 상태가 다 되면 실행하는 이벤트로써

다운로드와 같은 것들을 기다리지는 않는다!