본문 바로가기
컴퓨터과학[2-1]/knou_[2-1]HtmlXml

HTML/XML XML - 웹에서 XML 파싱하여 출력하기. (Internet Explorer 전용)

by boolean 2015. 4. 27.
728x90

XML - 웹에서 XML 파싱하여 출력하기. (Internet Explorer 전용)

// book.xml

<?xml version="1.0" encoding="utf-8"?>
<booklist>
<book isbn="B001" kind="JAVA">
<title>자바 기초</title>
<author>홍길동</author>
<price>25000</price>
</book>
<book isbn="B002" kind=".NET">
<title>닷넷 프레임워크</title>
<author>김길동</author>
<price>20000</price>
</book>
</booklist>



// DomTest05.html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Javascript에서 DOM 사용</title>
<script type="text/javascript">
   1:  
   2: function domTest() {
   3:     //1단계. XML 파일 불러오기 -> DOM tree 형성
   4:     // 2단계. root 노드(엘리먼트) 접근
   5:     // 3단계. 특정 노드(엘리먼트) 접근
   6:     // 4단계. 특정 노드(엘리먼트)의 텍스트(노드) 접근
   7:     
   8:     // Internet Explorer 전용
   9:     var xmlDoc = new ActiveXObject("Msxml2.DOMDocument.6.0");
  10:     xmlDoc.load("book.xml");
  11:     
  12:     var root = xmlDoc.documentElement;
  13:     var str = "";
  14:     str += "<br>" + root.nodeName + "<br><br>";
  15:     
  16:     var bookNodes = root.getElementsByTagName("book");
  17:     // var bookNode = bookNodes[0]
  18:     for(var i=0; i<bookNodes.length; i++) {
  19:         var bookNode = bookNodes[i];
  20:         var isbn = bookNode.getAttribute("isbn");
  21:         var titleNode = bookNode.getElementsByTagName("title")[0];
  22:         var authorNode = bookNode.getElementsByTagName("author")[0];
  23:         var priceNode = bookNode.getElementsByTagName("price")[0];
  24:         
  25:         str += "isbn : " + isbn + "<br>"
  26:              + "제목 : " + titleNode.text + "<br>"
  27:              + "저자 : " + authorNode.text + "<br>"
  28:              + "가격 : " + priceNode.text + "<br><br>";
  29:     }
  30:     
  31:     var divTag = document.getElementById("result");
  32:     divTag.innerHTML = str;
  33: }
</script>
</head>
<body>
<div>DOM 테스트</div>
<div>
<input type="button" value="XML DOM" onclick="domTest()">
</div>
<div id="result"></div>
</body>
</html>

출처 : 이글루스

댓글