LHJ

I'm a FE developer.

19.3 DOM 기다리기

03 Jun 2020 » js_lj

19.3 DOM 기다리기

브라우저가 HTML 파일을 읽고 해석하고 렌더링하는 과정은 복잡합니다.
경험이 부족한 웹 개발자는 브라우저가 DOM을 구축하기도 전에 요소에 접근하려 하다가 에러를 겪는 일이 많습니다.

제이쿼리에서는 브라우저가 페이지를 완전히 읽고 DOM을 구축한 다음에만 호출되는 콜백 안에 코드를 작성해서 이런 문제를 피할 수 있습니다.

$(document).ready(function() {
    // 여기 있는 코드는 HTML을 모두 불러오고
    // DOM이 구성된 다음 실행됩니다.
});

위 코드는 여러 번 써도 안전하므로, 제이쿼리 코드를 몇 개로 나누어 써도 모두 DOM을 불러온 뒤에 실행됩니다.
다음과 같은 단축 표기도 있습니다.

$(function() {
    // 여기 있는 코드는 HTML을 모두 불러오고
    // DOM이 구성된 다음 실행됩니다.
});

제이쿼리를 사용할 때는 코드를 모두 이런 블록에 넣을 때가 아주 많습니다.