choice blog

Html파일에서 xml 데이터 접근하기

예시

<p id="demo1"></p>
<p id="demo2"></p>
<p id="demo3"></p>
<p id="demo4"></p>

<script type="text/javascript">
// xml 데이터 접근 예시
let xmltext = "<bookstore>" + 
				  "<book>" + //("book")[0]
				   		"<title>탈무드</title>" +  // childNodes[0]
				  		"<author>man</author>" + // childNodes[1]
				  		"<year>2001</year>" +
				  "</book>" +
				  "<book>" +
				  		"<title>이솝이야기</title>" +
				  		"<author>woman</author>" +
				  		"<year>2004</year>" +
				  "</book>" +
			  "</bookstore>";
		  
let parser, xmlDoc;
// xml로 불러올땐 이작업이 필요없다---------
parser = new DOMParser(); 
xmlDoc = parser.parseFromString(xmltext, "text/html"); // xmltext형태가 parser로 바뀐것
//-----------------------
document.getElementById("demo1").innerHTML
	= xmlDoc.getElementsByTagName("book")[0].childNodes[1].nodeName; // 태그명 얻기
document.getElementById("demo2").innerHTML	
	= xmlDoc.getElementsByTagName("book")[0].childNodes[0].childNodes[0].nodeValue; // 태그안에 데이터(탈무드)가져오기
document.getElementById("demo3").innerHTML
	= xmlDoc.getElementsByTagName("book").length; //2
document.getElementById("demo4").innerHTML
	= xmlDoc.getElementsByTagName("book")[0].childNodes.length; // 3
</script>

설명

DOMParser() :  XML문서를 파싱하는 해석 객체이다.

parseFromString : 문자열을 파싱한다.

xmlDoc.getElementsByTagName("book")[0].childNodes[1].nodeName : 태그명을 가져온다.

xmlDoc.getElementsByTagName("book")[0].childNodes[0].childNodes[0].nodeValue : 해당태그의 value를 가져온다.

실행화면