반응형
말 그대로 Node가 어떤 종류의 Node인가를 확인할 수 있는 기능을 말한다.
Node 라는 객체에 있는 여러 프로퍼티들을 출력한다.
대문자로 되어있는 것은 상수라고 한다. 정해져있는 값이라는 의미이다.
이 결과가 의미하는 것은,
어떠한 노드가 엘리먼트 객체에 해당하는 노드라면 ELEMENT_NODE 로 접근할 수 있으며 숫자값은 1이 되고
어떠한 노드가 텍스트에 해당하는 노드라면 TEXT_NODE 로 접근할 수 있고 숫자값이 3이 된다 라는것을 의미한다.
<body id="start">
<ul>
<li><a href="./1">Chelsea</a></li>
<li><a href="./2">Liverpool</a></li>
<li><a href="./3">Tottenham</a>
<ul>
<li>Son</li>
<li>Kane</li>
<li>Alli</li>
</ul>
</li>
</ul>
위와 같은 코드가 있다고 한다면,
start 라는 id값을 가진 body 엘리먼트에 대한 객체를 변수 A에 담았다.
이 body 노드의 nodeType을 확인해보면,
1이라는 숫자값이 나오는 것을 확인할 수 있고 위 정보에서 보면 그것은 ELEMENT_NODE 가 된다.
즉, body 노드는 엘리먼트 노드라는 것을 알 수 있는 것이다.
body의 첫번째 자식노드는 줄바꿈이라는 텍스트노드이며 노드타입을 확인해보면 3, 즉 TEXT_NODE 임을 알 수 있다.
줄바꿈노드 다음에 오는 sibling 노드는 ul이며, nodetype은 1(ELEMENT_NODE)이고, node이름은 UL 임을 알 수 있다.
이처럼 nodeType은 해당 엘리먼트가 어떠한 타입의 노드인지를 확인할 수 있고,
nodeName은 해당 노드에 대해 조금 더 디테일한 정보(ul인지 li인지 등)를 알 수 있는 기능이다.
반응형
'Javascript' 카테고리의 다른 글
18. 이벤트 전파(버블링/캡처링) (0) | 2021.09.28 |
---|---|
17. 이벤트 (0) | 2021.09.27 |
15. Node 관계 API (0) | 2021.09.17 |
14. jQuery 조회 범위 제한 (0) | 2021.09.16 |
13. jQuery 속성 제어 (0) | 2021.09.15 |