본문 바로가기

Web/Javascript

DOM API 정의

출처 | http://blog.naver.com/tnsgus239/220512860363


■ DOM (Document Object Model)

- HTML과  XML 문서의 data를 효과적으로 다루기 위한 API

- 문서의 논리적 구조와 문서가 접근되고 다루어지는 방법 정의

- 객체(Object)로 모델링, 트리(tree)구조의 논리적인 형태로 표현


■ DOM의 장점

- 문법으로부터 내용을 추천

- 내부 문서 조작의 단순화

- 전형적인 계층적 또는 관계형 DATABASE 구조와 유사


■ XML 문서에서의 DOM 해석


■ Node Object


■ insertBefore(newChild, refChild)

- newChild

: 문서의 계통도에 삽입될 새로운 element를 지정 createElement 메소드에 의하여 생성될 수 있는 element

- refChild

: 새로운 element가 위치할 자리를 지정하는 객체

- 반환값

: 문서에 새로이 삽입된 엘리먼트의 참조를 반환함


■ replaceChild(newChild, oldChild)

- newChild

: 문서에 삽입할 새로운 element를 지정하는 객체

- oldChild

: 교체당할 기존의 element를 지정하는 객체

- 반환값

: 교체된 개체를 참조함



■ removeChild(oldChild)

- oldChild

: 문서로부터 제거할 element를 지정하는 개체

- 반환값

: 제거된 개체의 참조


■ appendChild(newChild)

- newChild

: 첨부되는 element를 지정하는 개체

- 반환값

: 첨부된 자식 element를 참조하는 개체를 반환함



■ hasChildNodes()

- 반환값

: 자식개체를 가지고 있는가를 나타내는 부울값


■ cloneNode(deep)

- Boolean

: 디폴트이며, 복사된 개체는 childNode를 포함하지 않음

: 복사된 개체는 childNodes를 갖음

- 리턴값

: 새로 생성된 node의 참조하는 개체를 반환함




■ Element Object


■ getAttribute(name)

- name

: attribute의 이름을 나타내는 문자열

- 반환값

: attribute에 의하여 정의된 값을 반환함


■ setAttribute(name, value)

- name

: attribute의 이름을 지정하는 문자열

- value

: attribute의 할당값을 지정

- 반환값

: 없음


■ removeAttribute(name)

- name

: 제거할 attribute의 이름을 나타내는 문자열

- 반환값

: 성공적으로 제거되었는지 나타내는 boolean값


■ Document Object


■ createElement(tagName)

[출처] ▶ Ajax 10. DOM API|작성자 soon