[JavaScirpt] Node객체 API

이전에 Node객체와 관계API를 공부했는데

이번에 종류API와 변경 API를 정리해보자.

종류API

for(var name in Node){

console.log(name , Node[name])

}

위 코드는 모든 노드객체에 대한 타입값을 출력한다.

그리고

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

를 한 후

body.nodeType을 하게 되면

1

이 리턴 된다.

이는 엘리먼트_ 노드이다.

그리고 body.nodeName을 할 시에는 'body'가 리턴된다.

document.nodeType은 9를 리턴한다.

그리고 document.nodeName을 할 시에는 #document.

곧 document객체명을 리턴한다.

      

다음을 보자!

참고로 이 코드는 재귀함수로 되어있다.

재귀함수는 함수가 자기를 호출하는 것을 의미한다.

결과는 바디 태그의 모든 엘리먼트들이 출력이 된다.

자세히 보자

일단 traverse 함수의 파라미터 값으로 첫번째는 바디태그엘리먼트 두번째는 파라미터값을 콘솔로 출력하는 익명함수를 대입했다.

traverse는 할당 이후에 수행되고

만약 target(바디태그엘리먼트)의 노드타입이 엘리먼트노드일경우

두번째 파라미터인 콜백( 파라미터값을 콘솔로 출력하는 입력함수)을 target이라는 파라미터(바디태그엘리먼트)를 넣어 출력한다

그 후 변수 c에 target에 모든 노드들을 유사행렬로 리턴하고

for문을 통해 모든 노드들을

traverse행렬의 파라미터 값으로 해서 실행한다.

###############

자 그러면 traverse의 함수를

traverse(document.getElementById('start'), function(elem){

elem.style.color = 'red'

});

이와 같이 입력한다면?

자 그렇다면

traverse(document.getElementById('start'), function(elem){

if(elem.nodeName ==='A'){

elem.style.backgroundColor = 'blue';

}

elem.style.color = 'red'

});

이렇다면?

모두 정상대로 작동한다. 마지막 꺼만 해석해보면

만약 elem(언젠가 모든 엘리먼트들이 for문에 의해 접근 될꺼임).의 노드 네임이 에이태그라면{

그 태그는 백그라운드를 블루로 만든다!

}