[JavaScript] DOM

# DOM (Document Object Model)

- 브라우저의 렌더링 엔진은 HTML 문서를 파싱하여 브라우저가 이해할 수 있는 자료구조인 DOM을 생성한다.

- HTML 문서의 계층적 구조와 정보를 표현하며 이를 제어할 수 있는 API, 즉 프로퍼티와 메서드를 제공하는 트리 자료구조다.

- DOM에 수행하는 모든 연산은 document 객체에서 시작한다.

 

 

---

참고)

https://ko.javascript.info/searching-elements-dom

getElement*, querySelector*로 요소 검색하기

# 요소 노드 검색

① id를 이용한 요소 노드 검색

- Document.prototype.getElementById 메서드는 인수로 전달한 id 어트리뷰트 값을 갖는 하나의 요소 노드를 탐색하여 반환한다.

-

 

 

② 태그 이름을 이용한 요소 노드 검색

 

 

③ class를 이용한 요소 노드 검색

- 

 

④ CSS 선택자를 이용한 요소 노드 검색

-

-

 

⑤ 특정 요소 노드를 검색할 수 있는지 확인

- Element.prototype.matches 메서드

- 인수로 전달한 CSS 선택자를 통해 특정 요소 노드를 검색할 수 있는지 확인한다.

- 주어진 CSS 선택자와 일치하는지 여부를 판단한다. → true(일치O), false(일치X) 반환