ruriruriya

React를 사용하다 보면 DOM(Document Object Model)이라는 개념이 자주 등장한다.React는 일반 DOM과 다르게 가상 DOM(Virtual DOM)을 사용한다.그렇다면 일반 DOM과 가상 DOM의 차이점, 그리고 React에서 DOM이 어떻게 동작하는지 정리해보자. 1️⃣ DOM이란? ✅ DOM (문서 객체 모델, Document Object Model)HTML 문서를 브라우저가 이해할 수 있도록 객체 트리 구조로 변환한 것이다.즉, 웹페이지의 구조를 나타내는 프로그래밍 인터페이스라고 할 수 있다.📌 DOM의 예시HTML이 다음과 같다고 가정하자. 안녕, React! 클릭➡️ 브라우저는 이 HTML을 DOM 트리 구조로 변환한다.Document ├── ├── ..

자바스크립트의 DOM(Document Object Model)이란? HTML 및 XML 문서의 프로그래밍 인터페이스이다. DOM은 문서의 구조적 표현을 제공하고 프로그램이 문서 구조, 스타일 및 내용을 변경할 수 있도록 한다. 웹 페이지를 브라우저에서 렌더링할 때, 브라우저는 HTML 문서를 DOM으로 변환한다. 이 DOM은 문서의 모든 요소, 속성 및 텍스트를 노드로 나타내는 계층적인 트리 구조이다. DOM의 주요 개념 1. 노드 DOM의 기본 요소로, 문서의 모든 부분(요소, 속성, 텍스트 등)이 노드이다. 각 노드는 다른 노드와 관계를 가지며, 이런 관계는 트리 구조로 표현된다. 2. 요소 노드 HTML 태그에 해당하는 노드로 , , 등이 있다. 요소 노드는 속성 노드와 텍스트 노드를 포함할 수 있..