Dom이란

목차

계속 글을 쓰면서
이해가 부족한 개념을 발견하고
내일은 이거 써야지!!
해놓고 까먹는다...
아이템 포스트를 하나 만들어서 기록해놔야겠다

 

DOM

DOM이란 Document Object Model의 약자로서
흔히 문서 객체 요소라 한다.

 

이는 MDN에서

HTML, XML 문서의 프로그래밍 interface이다.

라고 명시하고 있다.

interface는 서로의 다른 두 개의 시스템을 연결하는 매개이다.

 

이제 정리하면,

HTML XML 문서를 프로그래밍 언어나 스크립트 언어가(ex. 자바스크립트) 인식할 수 있게,

글의 나열인 문서에서 하나하나 속성을 넣고, 선택할 수 있는

객체 문서로 바꾼것이다.

 

데이터 타입

Node

DOM에 포함된 모든 요소를 node라 통칭한다

HTML 문서 전체를 포함한 Document node,

바로 밑에서 얘기할 요소(Element), 속성(Attribute), 주석까지도(comment)

Node라고 불린다.

 

특이사항으로

html 요소를 얘기할 때,

부모 자식 관계를 가진 객체도 노드라 얘기한다.

(나는 태그라 얘기했었다. 이제 노드라 얘기해야지 ㅎㅎ)

 

Element

여는 태그와 닫는 태그 사이에 있는 모든 것을 Element라고 한다.

<p>
  Yeah!
</p>

예제에 있는 모든 것이, Element라 할 수 있겠다.

 

Attribute

Attribute는 속성으로써,

Html에서 태그에 붙이는 모든 속성을 뜻한다.

class도 id도 attribute다.

HTML | Class Attribute - GeeksforGeeks

... 조금 불안해서 찾아도 봤다.

 

끝

개념 쪽을 포스트 하다 보면,

개념이 확실치 않게 나와 자세히 알아보다 시간이 오래 걸리는 경우가 많다.

물론 코딩 포스트는 코드 짜고 캡처하고 편집하는 과정이 대신 있지만.

 

어쨌든, 이번 글도 element가 tag사이에 있는 모든 걸 포함한다는데,

node에 참조한 이미지에서는 text와 element가 구분되어있다.

또한 데이터 타입에 참조한 이미지에서는 element와 Attr가 구분되어있다.

그리고 Attribute에 포함된 style로도 tag의 text를 지정할 수 있다.

 

........ 뭐 따로따론데 제어권을 가져와 제어했다 이런 식으로 할 수도 있지만

포스트 하는 입장에서,

누군가가 이 글을 보고 그 사람의 한 개념이 고정될 수 있는데

이럴 수도 있다는 걸로 말해야 하는 것에 안타까움을 느낀다.