[JavaScript강의노트] DOM 사용하기 (2)

문서 객체 모델 (DOM)

속성 다루기

이전 강의노트에서 getElementById() 메서드와 getElementsByTagName() 메서드를 이용하여 엘리먼트 노드(HTML에서는 태그라고 한다는 거 아직 기억나죠?)에 접근하는 방법을 익혀봤습니다. 그럼 이렇게 엘리먼트 노드에 접근해서 무슨 작업을 할 수 있을까요? 바로 지금 소개하는 메서드가 이렇게 선택된 엘리먼트 노드를 대상으로 어트리뷰트 노드(이건 HTML에서 속성입니다.)를 추가하거나 변경, 읽기 등을 할 수 있도록 합니다.

getAtrribute()

엘리먼트 노드에 붙어있는 어트리뷰트 노드의 값을 읽어 들이기 위해 사용합니다.

var element = document.getElementById("headline");
alert(element.getAttribute("title"));

setAtrribute()

어트리뷰트 노드의 값을 읽을 뿐만 아니라 변경이나 추가도 할 수 있습니다. 바로 setAttribute() 메서드입니다.

var element = document.getElementById("headline");
element.setAttribute("title", "속성을 추가합니다.");