XML 이란?
XML은 eXtensible Mark-up Language 의 약자로써 직역을 하면
확장가능한 마크업 언어로 해석할 수 있으며, html과 거의 흡사하다. 다만 사용목적이 html과는 다르다.
W3C에서 정보를 쉽게 교환하기 위하여 만든 포멧이며, 데이터를 설명하는 tag를 사용자 마음데로 정의가 가능하다.
다른 마크업언어를 생성할 수도 있으며, 텍스트로 구성되어있기 때문에 하드웨어나 소프트웨어에 제한을 받지 않는다. 태그자체가 확장성이 있기 때문에 어떤분야의 데이터로 정확하게 기술 할 수 있다는 장점이 있다.
즉, DB를 통하지 않고 xml 문서를 통해 택스트만으로 쉽게 정보 교환이되는것이 장점이다.
XML 파일 구조
아래와 같이 HTML과 동일하게 tag를 사용할 수 있지만 예약어가 존재하지 않으며, 사용자가 정의한 태그로 사용이 가능하다. 또한 텍스트 이므로 하드웨어나 소프트웨어를 가리지 않기 때문에 데이터를 주고받고 저장하는것에 제한이 없으며, 어떠한 분야라도 태그명으로 정확하게 데이터를 기술 할 수 있게된다.
<선수들>
<선수>
<이름>홍길동</이름>
<나이>24</나이>
<주소>서울시</주소>
</선수>
<선수>
<이름>일지매</이름>
<나이>21</나이>
<주소>부산시</주소>
</선수>
</선수들>Java Script 에서 XML사용 예시
XMLHttpRequest 객체
서버로 부터 XML 데이터를 전송 받아 처리하는데 사용되는 객체이다.
이 객체를 사용하면, 웹페이지가 전부 로딩이 된 후에도 서버로부터 데이터를 요청하거나 데이터를 전송 받을 수 있게 된다. 즉, 웹 페이지 전체를 다시로딩하는 방법이 아닌 일부분만 갱신할 수 있게된다.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<button type="button" onclick="loadXMLDoc()">p tag 내용변경 버튼</button>
<p id="demo">p tag</p>
<script type="text/javascript">
var xhttpReq = new XMLHttpRequest();
function loadXMLDoc() {
xhttpReq.onreadystatechange = function () {
// console.log( this.responseText );
// console.log( this.readyState );
// console.log( this.status );
if(this.readyState == 4 && this.status == 200){
document.getElementById("demo").innerHTML = this.responseText;
}
}
xhttpReq.open("GET", "test.txt", true); // get post방식 설정, url주소, 동기/비동기 요청설정
xhttpReq.send(); // send() == get방식 send(String) == post방식
}
/*
responseText
텍스트로 response
responseXML
XML로 response
readyState
0 -> open() 메소드를 수행하기전에
1 -> loading 중...
2 -> loading 완료
3 -> Server 처리 중...
4 -> Server 처리 완료
status
200 -> 접근 성공
403 -> 접근 금지 페이지
404 -> 접근 페이지 없음.
500 -> 접근 페이지 구문 에러
*/
</script>
</body>
</html>DOMParser 객체
xml 문서를 JavaScript의 DOM 접근방식과 유사하게 xml을 접근할 수 있게 도와주는 객체이다.
JS의 DOM과 유사하게 구현되어있는것이 장점이다. childNodes, firstChild, lastChild, nextSibling 등.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<p id="demo"></p>
<script type="text/javascript">
var xmltext = "<bookstore>" +
"<book>" + /* node */
"<title>탈무드</title>" +
"<author>man</author>" +
"<year>2001</year>" +
"</book>" +
"<book>" + /* node */
"<title>이솝이야기</title>" +
"<author>woman</author>" +
"<year>2004</year>" +
"</book>" +
"</bookstore>";
var parser, xmlDoc;
parser = new DOMParser();
xmlDoc = parser.parseFromString(xmltext, "text/html");
document.getElementById("demo").innerHTML
// = xmlDoc.getElementsByTagName("book")[0].childNodes[0].nodeName; // title
// = xmlDoc.getElementsByTagName("book")[0].childNodes[1].nodeName; // author
// = xmlDoc.getElementsByTagName("book")[0].childNodes[0].childNodes[0].nodeValue; // 탈무드
// = xmlDoc.getElementsByTagName("book")[0].childNodes[0].innerHTML; // 탈무드
// = xmlDoc.getElementsByTagName("book").length; // node의 길이
= xmlDoc.getElementsByTagName("book")[0].childNodes.length; // node의 node길이
</script>
</body>
</html>'Algorithm, Data Structure > XML and JSON' 카테고리의 다른 글
| JSON이란? (0) | 2020.01.15 |
|---|---|
| JAVA에서 XML문서 읽기 (0) | 2020.01.15 |