DOM 트리의 모든 것: HTML에서 브라우저 렌더링까지

DOM 트리의 기본 구조HTML 문서는 브라우저에 의해 DOM 트리로 변환됩니다. DOM 트리는 계층 구조를 이루며, 각 HTML 태그는 요소 노드로 태그 안의 텍스트는 텍스트 노드로 표현됩니다. Hello, world! 또한, 테이블 태그의 경우 태그가 생략되더라도 브라우저는 자동으로 생성합니다. Cell 1이 HTML은 브라우저 내에서 다음과 같이 처리됩니다. Cell 1 이처럼 브라우저는 HTML 문서를 정리하여 DOM 트리를 생성하므로, 우리가 작성한 HTML과 최종 DOM 사이에 차이가 있을 수 있습니다.공백과 텍스트 노드HTML 내의 줄 바꿈(엔터)과 공백 문자도 텍스트 노드로 간주됩니다.예를 들어, 아래와 같이 작성된 HTML에서 H..

• format_list_bulleted 브라우저
• · 2025. 2. 19.
• textsms

브라우저 환경

window 객체전역 객체전역 변수와 함수는 모두 window 객체의 프로퍼티로 존재합니다.function sayHello() { console.log("Hello!");}// 전역 함수는 window.sayHello로 호출할 수 있습니다.window.sayHello(); // Hello!브라우저 창 제어window 객체는 브라우저 창(또는 탭) 자체를 제어하는 다양한 메서드와 프로퍼티를 제공합니다.// 현재 창의 내부 너비와 높이를 기록합니다.console.log("창 너비:", window.innerWidth);console.log("창 높이:", window.innerHeight);DOM: 문서 객체 모델DOM은 HTML 문서의 구조를 객체 트리 형태로 표현합니다. 이를 통해 자바스크립트는 페이지..

• format_list_bulleted 브라우저
• · 2025. 2. 19.
• textsms