chapter 09. DOM

1. chapter 09. DOM

2. 학습목표 • DOM 기본 개념 이해 • DOM API 기본 인터페이스 구성 이해 • DOM API 활용 방법 학습 • DOM을 활용한 XML 문서 조작 방법 익히기

3. 1. DOM 개념 • DOM 개념 • Document Object Model(문서 객체 모델) 약어 • HTML 문서와 XML 문서를 조작하기 위한 API • 일반 프로그래밍 언어나 스크립트를 가지고, HTML이나 XML 문서의 내용, 구조, 스타일 정보를 검색하고 수정할 수 있도록 하는 플랫폼 또는 인터페이스 • DOM 사용 목적 • 어떠한 환경이나 애플리케이션에서도 사용할 수 있는 표준 프로그래밍 인터페이스 제공

4. 1. DOM 개념 • DOM을 이용한 XML 문서 생성 과정 • ① XML 문서를 조작하기 위해 XML 문서를 읽어들인다. • ② XML 파서로 XML 문서를 문서 트리 구조로 변환한다. • ③ DOM API를 사용해서 읽어들인 XML 문서의 요소, 속성, 텍스트 내용을 추출한 후 XML 문서를 조작한다(XML 문서 추가, 삭제, 수정 등). • ④ 조작한 XML 문서를 애플리케이션에 따라서 생성, 수정, 삭제한 후 결과 문서를 만든다. ④ ③ ① ②

5. 1. DOM 개념 • XML 문서의 트리 구조 • DOM은 XML 문서를 하나의 객체 모델로 인식 • 각 객체를 인터페이스 개념으로 접근 • 외부 애플리케이션은 객체에 정의된 인터페이스를 통해 해당 객체를 제어

6. 레벨 1 HTML과 XML 문서를 검색/관리할 수 있는 인터페이스 제공 레벨 2 네임스페이스를 비롯해서, 뷰, 스타일시트, CSS, 이벤트 모델 자원, 노드 횡단(traversal)을 지원하는 인터페이스 포함 레벨 3 윈도우에서 사용할 수 있는 사용자 인터페이스 포함 DOM 레벨 주요 내용 1. DOM 개념 • DOM 레벌

7. 1. DOM 개념 • DOM의 구조적 모델 • DOM은 XML 문서를 노드 클래스와 하위 클래스 인스턴스를 트리 구조로 조합하여 표현 • 특정 노드의 하위 클래스는 요소, 텍스트, 주석을 인스턴스로 갖는다. • DOM을 이용한 XML 문서의 접근 방식

8. 1. DOM 개념 • DOM 기본 인터페이스 구성도

9. DOMImplementation NodeList 종류 내용 Node DOM 구현과 관련한 정보 제공 노드 객체를 저장하는 콜렉션 객체 DocumentFragment DOM 내부 트리 자료구조에서 노드에 해당 트리에 대한 탐색, 추가, 삭제, 수정 기능 제공 Document 임시 XML 문서를 다룸 XML 문서에 해당. 노드 인터페이스를 상속 받음 XML 문서 내부 요소 탐색과 생성 기능 제공 Element XML 문서에서 요소에 해당하는 객체를 다룸 Attr XML 문서에서 요소 속성에 해당하는 객체를 다룸 XML 문서에서 PCDATA, 속성 값, 주석 등에 사용되는 텍스트를 다룸 CharacterData XML 문서에서 PCDATA에 해당하는 내용을 다룸 XML 문서에서 주석에 해당하는 내용을 다룸 Text NodeList의 기능과 유사. 이름을 이용해서 노드에 접근하고, 객체에 포함된 속성을 추출할 때 사용 Comment NamedNodeMap 1. DOM 개념 • DOM Core 기본 인터페이스

10. 종류 내용 CDATASection XML 문서에서 CDATA Section에 해당 DocumentType 문서의 타입 정의에 해당하는 객체 Notation DTD의 Notation에 해당하는 객체 EntityReference XML 문서에서 Entity에 대한 참조에 해당하는 객체 Entity XML 문서에서 Entity에 해당 ProcessingInstruction XML 문서의 processing instruction 부분에 해당 1. DOM 개념 • DOM Core 확장 인터페이스

11. <students> <student> <name>박미영</name> <age>25</age> </student> <student> <name>고소영</name> <age>24</age> </student> </students> students.xml 1. DOM 개념 • XML 문서를 DOM 인터페이스를 적용해서 트리 형태로 작성한 예

12. 2. DOM API 활용 • DOM 인터페이스 속성

13. 2. DOM API 활용 • Node 인터페이스 • DOM의 기본 자료형. DOM 트리에서 노드 표현시 사용

14. 2. DOM API 활용 • Node 인터페이스::멤버 필드

15. 2. DOM API 활용 • Node 인터페이스::노드 속성

16. 2. DOM API 활용 • Node 인터페이스::노드 정보를 얻는 메소드

17. 2. DOM API 활용 • Node 인터페이스::XML 문서 조작을 위한 메소드

18. 2. DOM API 활용 • 노드 인터페이스::부모, 자식, 형제 노드 관련 정보를 얻는 메소드

19. 2. DOM API 활용 • Document 인터페이스 • 문서 전체에 접근을 제어하는 인터페이스 • 노드 인터페이스에서 확장된 인터페이스 • 노드 메소드와 속성을 문서 객체 내에서 사용 가능 • 역할 작업 • 노드 트리 검색 • 노트 검색하거나 노드 목록 반환 요구 • 새로운 노드나 속성 생성 • 제공 메소드 • 문서 관련 정보를 얻는 메소드 • 문서 트리를 순회하기 위한 메소드 • 문서를 작성하기 위한 메소드

20. 2. DOM API 활용 • Document 인터페이스:: 문서 관련 정보를 얻는 메소드

21. 2. DOM API 활용 • Document 인터페이스::문서 트리를 순회하기 위한 메소드

22. 2. DOM API 활용 • Document 인터페이스::문서를 작성하기 위한 메소드

23. 2. DOM API 활용 • DOMImplementation 인터페이스 • DOM을 구현할 때 어떤 문서에나 적용가능한 메소드 제공 • Document 인터페이스와 implementation 속성을 이용해서 DOMImplementation 객체 생성도 가능 • DOMImplementation 인터페이스의 메소드

24. 2. DOM API 활용 • DocumentFragment 인터페이스 • 문서 조각을 쉽게 조작할 수 있도록 잠시 보관 • 보관하는 문서가 반드시 정형식 문서일 필요는 없다. • Node 인터페이스가 제공하는 속성과 메소드 제공 • 객체로 자식을 포함할 수도, 아닐 수도 있음 • 자식의 의미는 노드나 텍스트 노드 등이 될 수 있다. • DocumentFragment 객체 역시 Node 인터페이스에서 제공하는 메소드를 이용하면 자식을 다른 곳으로 보낼 수 있지만, 자기 자신에 해당하는 객체는 어디에서 복사할 수 없다.

25. 2. DOM API 활용 • NodeList 인터페이스 • DOM을 구현할 때 하나 이상의 노드를 반환하도록 하는 메소드나 속성의 요청이 있을 때 반환되는 객체 • 정렬된 집합체 형태 • 여러 개의 노드를 호출할 때 유용 • NodeList에 포함된 노드들은 인덱스 값을 이용해서 접근할 수 있고, 인덱스는 0부터 시작 • NodeList에서 얻는 노드 순서는 XML 문서에서 부모 노드에 노드를 추가한 순서 • NodeList 노드는 반드시 부모와 자식 관계나 형제 관계일 필요는 없지만, 적어도 문서의 한 부분이어야 한다.

26. 2. DOM API 활용 • NodeList 인터페이스에서 제공하는 메소드

27. 2. DOM API 활용 • Element 인터페이스 • 요소로 바로 접근해서 작업할 수 있도록 하는 인터페이스 • 유일한 속성은 tagName 속성 • tagName 속성은 요소 이름을 반환하며, 읽기 전용 속성으로 사용 • 제공 메소드 • ①요소 객체의 속성에 접근해서 처리하는 메소드 • ②요소 태그에 접근하기 위한 메소드가 있다.

28. 2. DOM API 활용 • Element 인터페이스::요소 객체의 속성에 접근해서 처리하는 메소드

29. 2. DOM API 활용 • Element 인터페이스::요소 태그에 접근하기 위한 메소드

30. 2. DOM API 활용 • NamedNodeMap 인터페이스 • nodeList와 유사. 단, 정렬되지 않는 집합체 • 사용법도 NodeList 인터페이스와 유사 • item()메소드와 getLength() 메소드도 갖고 있음 • NamedNodeMap은 이름을 이용해서 노드에 접근하고자 할 때 사용 가능 • 주로 요소에 포함된 속성을 추출하기 위해 사용 • 노드는 이름과 인덱스 값을 이용해서 추출할 수 있고, 인덱스는 0부터 시작

31. 2. DOM API 활용 • NamedNodeMap 인터페이스의 메소드

32. 2. DOM API 활용 • Attr 인터페이스 • 요소의 속성에 대한 인터페이스 제공 • xml 문서의 트리 구조를 봤을 때 속성은 트리 구조를 형성하지 않는다. • 속성이 요소의 자식으로서 존재하는 것이 아니고 속성으로 존재하는 것이다. • node 속성인 parentNode, previousSibling, nextSibling은 속성에 적용할 때 null 값을 갖게 된다. • name 속성: 이름을 반환하는 읽기전용 속성 • value 속성: 값을 나타내는 속성 • 보통 속성이 가질 수 있는 값은 DTD에 정의

33. 2. DOM API 활용 • Attr 인터페이스의 메소드

34. 2. DOM API 활용 • CharaterData와 Text 인터페이스 • xml 문서에서 사용되는 텍스트를 다루기 위해서 만들어진 인터페이스 • Text는 CharaterData의 확장이지만, PCDATA, 속성 값, 주석 등 상당히 많은 곳에서 쓰임. • CharaterData 인터페이스도 Attr 인터페이스처럼 자식 노드를 포함할 수 없다는 점을 주의 • data 속성: CharaterData 노드 안의 텍스트로, 노드의 문자 데이터를 표현하거나 설정할 때 사용 • length 속성: 노드 안의 데이터 글자 수로, 노드가 비어있으면 0을 반환

35. 2. DOM API 활용 • CharaterData 인터페이스의 메소드

36. 2. DOM API 활용 • Text 인터페이스의 메소드

37. 3. DOM을 활용한 XML 문서 조작 • Comment 인터페이스 • 주석문을 쓰기 위한 인터페이스 • 메소드나 프로퍼티는 없음 • Comment 객체를 만들어서 문서에 추가를 하면 DOM이 자동으로 주석 마크업을 추가 • 주석의 마크업은 HTML과 마찬가지로 <!-- --> 형태

38. 스트림 구조 버퍼(buffer) FileReader FileWriter XML 문서 (file) XML 문서 (file) ~~1010101010110~~ 버퍼(buffer) XML 문서 XML 문서 3. DOM을 활용한 XML 문서 조작 • 데이터 입출력 차이점 • 자바 입출력에 의한 데이터 입출력 • DOM API에 의한 데이터 입출력

39. 3. DOM을 활용한 XML 문서 조작 • 요소 추가를 위해 사용할 메소드 • 요소 삭제를 위해 사용할 메소드

40. 3. DOM을 활용한 XML 문서 조작 • 데이터 추출을 위해 사용할 메소드 • 데이터 변환 • 데이터를 자동으로 의미에 맞게 변환하는 프로그램 제작