제이쿼리(jQuery) 기초 문법 - Ajax($.get())로 XML 데이터 바인딩

제이쿼리(jQuery) 기초 문법 

Ajax($.get())로 XML 데이터 바인딩

바인딩(binding)은 '묶다'라는 의미이다. 비동기 통신 기술을 이용하여 서버 데이터베이스(DB)에 데이터를 요청하고, 데이터 베이스에 요청한 데이터를 받아와 HTML 문단 태그에 결합하는 것을 바인딩이라 부른다.

 

데이터가 바인딩 되는 과정

 

**XML(eXtensible Markup Language)

XML은 확장 가능한 언어이므로 태그명을 사용자가 임의로 작성할 수 있다. 사용자가 임의의 태그명을 만들어 사용할 수 있기 때문에 많은 지식이 없어도 된다. 즉 서버의 데이터를 XML 데이터로 가공하는 것은 많이 어렵진 않은 편이다. XML은 주로 데이터를 배포할 목적으로 사용된다.

 

<?xml version="1.0" encoding="UTF-8"?>
<tag1>
<tag2>내용</tag2>
</tag1>

 

XML의 기본형으로 상단에는 버전과 인코딩 방식을 선언하고 사용자가 임의로 시작 태그와 종료태그를 사용하여 구조화된 데이터를 만든다.

 

HTML에서 $.get()메소드(데이터를 서버에 HTTP GET 방식으로 전송한 후 서버 측의 응답을 받을 때 사용)를 사용하여 비동기 통신방식으로 요청한 XML(eXtensible Markup Language)데이터를 바인딩해본다.

---

 

XML파일을 비동기식 get방식으로 로드하기

 

item.xml

 

 

자바스크립트의 보안 정책과 외부 데이터 바인딩

자바스크립트의 보안 정책은 자바스크립트로 A 사이트의 데이터를 B 사이트로 불러오는 것을 허용하지 않는다. 이 정책을 동일 출처 원칙(Same-origin policy)이라 한다. 즉 ajax() 메소드로는 서로 다른 도메인의 데이터를 전송할 수 없을 뿐만 아니라 교차 도메인(Cross-Domain)도 허용하지 않는다.

 

서로 다른 사이트에서 데이터를 서로 주고받으려면 서버 언어를 사용해 데이터를 가져오거나 JSONP를 사용하는 방법이 있다.