* DOM 에서 node
node type (종류)와 nodeType 값
Element node 1 <h1 class="heading">W3Schools</h1>
Attribute node 2 class = "heading" (deprecated)
Text node 3 W3Schools
Comment node 8
Document node 9 HTML 문서 자신, <html> 의 부모
DOCUMENT_TYPE_NODE 10 <!Doctype html>
** 명심! Element node 가 text 를 갖고 있는 것이 아니다!!!
JS 로 DOM의 node 간 navigate 할수 있다.
- parentNode
- childNodes[nodenumber]
- firstChild
- lastChild
- nextSibling
- previousSibling
- attributes
* Text node 의 값에 접근하는 방법 (3가지)
- document.getElementById('id01').innerHTML
- document.getElementById('id01').firstChild.nodeValue;
- document.getElementById('id01').childNodes[0].nodeValue;
nodeValue 는
- Element node의 nodeValue는 null
- Text node의 nodeValue는 text값
- Attribute node의 nodeValue는 attribute value
* document.body 노드 밑의 모든 child 노드의 nodeName, nodeValue, nodeType 을 출력해보세요
hint) document.body.childNodes 사용
* 특정 element.attributes : attribute node(들) 만 추출한다
'Javascript' 카테고리의 다른 글
[Javascript] setInterval (0) | 2022.03.11 |
---|---|
[Javascript] DOM - element (0) | 2022.03.11 |
[Javascript] DOM - event (0) | 2022.03.11 |
[Javascript] DOM (Document Object Model) - get (0) | 2022.03.11 |
[Javascript] Browser Object Model (브라우저 객체 모델) (0) | 2022.03.11 |