티스토리 뷰
cd.xml 파일 만들기
<?xml version="1.0" encoding="EUC-KR"?>
<compactdiscs>
<compactdisc>
<artist type="individual">OST</artist>
<title numberoftracks="3">연애시대 OST</title>
<tracks>
<track>1. 첫번째 노래</track>
<track>2. 두번째 노래</track>
<track>3. 세번째 노래</track>
</tracks>
<price>9000</price>
</compactdisc>
<compactdisc>
<artist type="band">코요테</artist>
<title numberoftracks="5">코요테5집</title>
<tracks>
<track>1. 첫번째 노래</track>
<track>2. 두번째 노래</track>
<track>3. 세번째 노래</track>
<track>4. 네번째 노래</track>
<track>5. 다섯번째 노래</track>
</tracks>
<price>8000</price>
</compactdisc>
<compactdisc>
<artist type="band">SeeYa</artist>
<title numberoftracks="4">SeeYa2집</title>
<tracks>
<track>1. 첫번째 노래</track>
<track>2. 두번째 노래</track>
<track>3. 세번째 노래</track>
<track>4. 네번째 노래</track>
</tracks>
<price>8500</price>
</compactdisc>
</compactdiscs>
cdList.html 파일 만들기
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title></title>
<script language="javascript">
function XmlInfo()
{
//XML로드
var xmlDoc=new ActiveXObject("microsoft.XMLDOM");
xmlDoc.async=false;
xmlDoc.load("cd.xml");
//원본 출력
document.all.txtOut.value=xmlDoc.xml;
//결과 출력(테이블)
var result="";
result+="<h3>CD List</h3>";
result+="<table border='1'><tr><th>artist</th><th>title</th><th>tracks</th><th>price</th></tr>";
//최상위 루트엘리먼트
var root=xmlDoc.documentElement;
for(i=0; i<root.childNodes.length; i++)
{
//artist
result+="<tr><td>";
result+=root.childNodes(i).childNodes(0).text+"<br/>";
result+="("+root.childNodes(i).firstChild.attributes(0).value+")</td>";
//title
result+="<td>";
result+=root.childNodes(i).childNodes(1).text+"<br/>";
result+="("+root.childNodes(i).childNodes(1).attributes(0).value+")</td>";
//tracks
result+="<td>";
var tracks=root.childNodes(i).childNodes(2);
for(j=0; j<tracks.childNodes.length; j++)
{
result+=tracks.childNodes(j).text+"<br/>";//track
}
result+="</td>";
//price
result+="<td>";
result+=root.childNodes(i).lastChild.text;
result+="</td>";
result+="</tr>";
}
result+="</table>";
iFrameDoc.document.write(result)
}
</script>
</head>
<body>
<h3>CD.xml</h3>
<textarea cols="80" rows="15" name="txtOut"></textarea>
<p></p>
<button onclick="XmlInfo()">DOM 표현 확인</button>
<p></p>
<iframe id="iFrameDoc" width="600" height="350"></iframe>
</body>
</html>
'프로그래밍 > Javascript' 카테고리의 다른 글
| [Javascript] 셀렉트박스 다중선택 이동하기 (0) | 2008.06.22 |
|---|---|
| [Javascript] DOM을 이용한 Element 추가 (0) | 2008.06.22 |
| [Javascript] DOM을 이용하여 이미지 동적 생성 하기 (0) | 2008.06.22 |
| [Javascript] 숫자를 문자(숫자)로 변환 (0) | 2008.06.22 |
| 자바스크립트 자료 참고 싸이트 (0) | 2008.06.22 |
- Total
- Today
- Yesterday