반응형
1. XMLHttpRequest 객체를 생성한다.
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 데이터가 아니라면 속성은 비어있게 됨


 
반응형
Posted by seungkyua@gmail.com
,