getElementsByTagName 으로 특정Tag를 선택한후 for/in 문으로 인덱스를 뿌렸을때 이상한 것을 발견했다.
1 2 3 4 | < h1 >보라돌이</ h1 > < h1 >뚜비</ h1 > < h1 >나나</ h1 > < h1 >뽀</ h1 > |
1 2 3 4 5 | var tagH1 = document.getElementsByTagName( "h1" ); for ( var i in tagH1){ console.log(i); // 0,1,2,3,length,item,namedItem } |
0,1,2,3 뿐만 아니라 length,item,namedItem 이란 요소가 따라왔다.
다시
1 2 3 4 5 | document.getElementsByTagName( "h1" )[0] // <h1>보라돌이</h1> document.getElementsByTagName( "h1" )[1] // <h1>뚜비</h1> document.getElementsByTagName( "h1" )[2] // <h1>나나</h1> document.getElementsByTagName( "h1" )[3] // <h1>뽀</h1> document.getElementsByTagName( "h1" )[4] // undefined |
배열로 접근한다고 잡히지도 않는다.
getElementsByTagName 는 배열이 아니라 nodelist이다.
더군다나 for in 문은 배열의 인덱스를 출력하는것이라기보다 오브젝트의 property를 뱉어낸다.
배열도 오브젝트이다. 인덱스를 뿌려줄수있으나 nodelist라던가 특정 object의 경우 프로퍼티까지 다 나온다.
반대로 배열에서
1 | var a = [ , , 3]; |
의 경우 일반 for문을 돌리면
1 2 | for ( var i=0; i < a.length ; i++) console.log(a[i]); // undefined, undefined, 3 |
이렇게 나오지만 for/in문을 쓰면
1 2 | for ( var i in a) console.log(i); // 3 |
이렇게 존재하는 요소만 출력한다.
Total Views: 979 ,