자바 스크립트 DOM 이해하기 핵심 아이디어 : nodeList와 HTMLElement 객체

Question

DOM을 매우 철저하게 이해하기 위해 노력해 왔습니다. 그 순간 나는 DOM 트리를 가로 지르는 내 방식의 물마루를 만들었고 나는 약간의 불일치를 발견하는 것 같다.

• i가 1 개 이상의 요소를 선택할 때 노드 목록가 반환 난 단지 한 요소를 선택할 때 는 HTMLElement가 반환

그래서 질문은, 왜이 코드 수익을 수행한다 a nodeList, 내가 1 li 만 선택하더라도.

는 예를 들어,이 바이올린을 참조하십시오 http://jsfiddle.net/AmhVk/5이

사람이 매우 철저하게 나에게 이것을 설명 할 수? 들으 ...

<ul id="jow"> 
    <li><a href="">Item</a></li>  
    <li><a href="">Item</a></li> 
    <li class="active"><a href="">Item</a></li> 
    <li><a href="">Item</a></li> 
    <li><a href="">Item</a></li> 
</ul> 

<div id="ieps"></div> 

function simple(){ 

var li = document.querySelectorAll(".active"); 
var ul = li[0].parentNode; 
var getULchild = ul.children[0]; 

var ieps = document.getElementById("ieps"); 

ieps.innerHTML += "ul will return = " + ul + "<br>"; 
ieps.innerHTML += "li will return = " + li + "<br><br>";   

ieps.innerHTML += "ul[0] will return: " + ul[0] + "<br>"; 
ieps.innerHTML += "li[0] will return: " + li[0] + "<br><br>"; 

} 

Answer 1

수정 :

• 이상의 1 요소를 선택할 수있는 함수를 호출 할 때 노드 목록가 반환됩니다
당신이 전화를 할 때 는 HTMLElement가 반환됩니다
• 최대 1 개의 요소를 선택할 수있는 함수

이렇게하면 각 호출에서 반환 된 값의 유형을 테스트합니다.

querySelectorAll은 정의되지 않은 수의 요소를 반환하도록 설계되었으므로 nodeList을 반환합니다.

반대로 getElementById을 사용할 때 일반적으로 nodeList를 반환 할 필요가 없습니다 (대부분 하나의 요소가 지정된 ID를 가질 수 있기 때문에 하나의 요소 또는 null을 직접 반환합니다).