2. URL 전달 인자 값을 escape() 로 처리한다.
3. XMLHttpRequest 객체의 onreadystatechange 속성에 callback 함수를 등록한다.
4. XMLHttpRequest 객체의 readyState 속성과 XMLHttpRequest 객체의 status 속성을 이용한다.
function createRequest() {
var request;
try {
request = new XMLHttpRequest();
} catch(tryMS) {
try {
request = new ActiveXObject("Msxml2.XMLHTTP");
} catch(otherMS) {
try {
request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (failed) {
request = null;
}
}
}
return request;
}
function getDetiales(itemName) {
// var 키워드를 사용하지 않고 전역으로 사용함
request = createRequest();
if (request == null) {
alert("Unable to create request");
}
var url = "ajaxtest2.php?imageId=" + escape(itemName);
request.open("GET", url, true);
request.onreadystatechange = displayDetails;
request.send(null);
}function displayDetails() {
if (request.readyState == 4) {
if (request.status == 200) {
var description = document.getElementById("description");
description.innerHTML = unescape(request.responseText);
}
}
}※ 비동기 호출을 두개 이상 사용한다면 request 전역객체를 각각 다른 변수로 지정해서 사용한다.
※ 비동기 호출로 쓰레드 문제와 같은 부분이 생기면 모니터 함수를 둔다. (모니터 함수에서 로직 체크)
3. XMLHttpRequest 객체의 속성
- readyState
. 요청객체의 현재 상태를 나타냄
- status
. 서버로부터 받은 상태코드
- statusText
. 서버로부터 받은 상태 코드 메세지 status 의 text 값으로 보면 됨
- responseXML
. 서버가 XML 형태로 데이터를 반환해 준다. XML 데이터가 아니라면 속성은 비어있게 됨
- responseText
. 서버가 Text 형태로 데이터를 반환해 준다. Text 데이터가 아니라면 속성은 비어있게 됨