DOM(Document Object Model)과 XML

Steps For Programmer/Ajax 2009. 9. 4. 08:11

DOM AIP에서 모든건 Node로 표현되며 문서의 각 구성 요소들은 모두 Node 또는 하위 인터페이스로 매핑됨

- Document : 전체 문서를 나타낸다.
- Element : 각 태그를 나타낸다.
- Text : 문자열 데이터가 Text 노드로 표현된다.
(ex. <title>웹 표준</title>에서 "웹 표준" 문자열은 Text 노드에 저장
- CDataSection : XML문서의 CDATA 영역의 문자열 값을 저장한다.

@ Node 인터페이스의 주요 프로퍼티

프로퍼티 타입	프로퍼티 이름	설명
String	nodeName	노드의 이름
String	nodeValue	노드의 값
unsigned short	nodeType	노드 타입
Node	parentNode	부모 노드
NodeList	childNodes	자식 노드 목록
Node	firstChild	첫 번째 자식 노드
Node	lastChild	마지막 자식 노드
Node	previousSibling	현재 노드와 같은 부모를 갖는 자식 노드 중 현재 노드 이전의 자식 노드
Node	nextSibling	현재 노드와 같은 부모를 갖는 자식 노드 중 현재 노드 다음의 자식 노드
Document	ownerDocument	이 노드가 포함된 Document 객체

NodeList는 length 와 item(i)를 제공한다.
- length : NodeList에 저장된 노드의 개수(NodeList의 길이)
- item(i) : 인덱스 i에 저장된 노드를 구함(i는 0부터 시작)

@ Node에 정의된 nodeType관련 상수값

NodeType	Named Constant
1	ELEMENT_NODE
2	ATTRIBUTE_NODE
3	TEXT_NODE
4	CDATA_SECTION_NODE
5	ENTITY_REFERENCE_NODE
6	ENTITY_NODE
7	PROCESSING_INSTRUCTION_NODE
8	COMMENT_NODE
9	DOCUMENT_NODE
10	DOCUMENT_TYPE_NODE
11	DOCUMENT_FRAGMENT_NODE
12	NOTATION_NODE

@ Document 인터페이스의 주요 프로퍼티 및 함수
- getElementsByTagName : 지정한 이름의 태그에 해당하는 NodeList를 구함
- getElementById : id 속성의 값이 일치하는 Element를 구함

@ Element 인터페이스의 주요 프로퍼티 및 함수
- getAttribute(String name) : name에 해당하는 속성의 값을 구한다.
- setAttribute(String name, String value) : 이름이 name인 속성의 값을 value로 지정한다.
- removeAttribute(String name) : 이름이 name인 속성을 제거한다.

@ Document 인터페이스의 Element 노드 생성 함수
- createElement(String tagName) : 지정한 태그 이름을 갖는 Element 노드를 생성한다.
- createTextNode(String text) : text를 값으로 갖는 Text 노드를 생성한다.
예)

var pNode =document.createElement("p");
var textNode= document.createTextNode("테스트");
pNode.appendChild(textNode);

@ Node 인터페이스의 DOM트리 변경 관련 함수

함 수	설명
insertBefore(Node newChild, Node refChild)	현재 노드의 자식 노드인 refChild 노드의 previousSibling 자리에 newChild 노드를 삽입
replaceChild(Node newChild,Node oldChild)	현재 노드의 자식 노드인 oldChild 노드를 새로운 newChild노드로 교체
removeChild(Node oldChild)	현재 노드의 자식 노드인 oldChild를 현재 노드에서 제거
appendChild(Node newChild)	newChild 노드를 현재 노드의 마지막 자식 노드로 추가

@ responseXML 응답 읽어오기
XMLHttpRequest 객체는 XML문서를 응답 데이터로 사용할 수 있다. responseXML을 사용하면 된다.

@ XSL/T는 XML문서를 XSL을 사용해서 원하는 문서로 변환시킬 때 사용되는 기술.
주로 XML문서를 HTML문서로 변환할 때 많이 사용된다. XML을 읽어 온후 XSL을 읽어오고 XSL을 사용해서 XML을 HTML 코드로 변환해야 한다.

IE의 경우

bookList.innerHTML=xmlDoc.transformNode(xslDoc);

IE가 아닌 경우

var xsltProc = new XSLTProcessor();
xsltProc.importStylesheet(xslDoc);
var fragment = xsltProc.transformToFragment(xmlDoc,document);
bookList.appendChild(fragment);