Ajax 기본 명령어

Ajax 기본 명령어

 

Ajax의 기본이 되는 명령어들

 

1. XMLHTTP :  윈도우판 IE에 XMLHTTP 오브젝트를 생성하는 클래스

 

서식 :    // windwos xp 이전

            oj = new ActiveXObject("Microsoft.XMLHTTP")

            //windows xp 이후

            oj = new ActiveXObject("MSXML2.XMLHTTP")

 

2. XMLHttpRequest : 윈도우판 IE이외에 XMLHTTP 오브젝트를 생성하는 생성자

 

서식 :  // IE를 제외한 다른 인터넷 어플리케이션

          oj = new XMLHttpRequest()

 

 

3. responseXML :  요청에 대한 응답을 XML형태로 반환한 프로퍼티

 

서식 : var xmlOj =  oj.responseXML;

 

4. responseText : 요청에 대한 응답을 Text형태로 반환한 프로퍼티

 

서식 : var textOj = oj.responseText;

 

5. status : 3자릿수의 숫자로 HTTP 상태 코드를 나타내는 프로퍼티

 

서식 :  value = oj.status

 

주요 상태코드

200 : OK(요청성공)

401 : Unauthorized (권한없음)

403 : Forbidden(접근거부)

404 : Not Found(요청 리소스 없음)

 

6. statusText : HTTP 상태 텍스트를 나타내는 프로퍼티

 

서식 :  value = oj.statusText;

 

7. abort() : 요청을 취소하는 메소드

 

서식 : oj.abort();

 

8. getAllResponseHeaders() : HTTP 요청에 대한 모든 헤더를 돌려주는 메소드

 

서식 : oj.getAllResponseHeader();

반환값 : HTTP 응답 헤더 (아직 도착하지 않았다면 NULL)

ex)

if(oj.readyState == 4){

   alert(oj.getAllResponseHeader());

}

 

 

9. getResponseHeader() : 인수로 지정한 응답 헤더를 돌려주는 메소드

 

서식 : value = oj.getAllResponseHeader(header);

인수 : 검색하고 싶은 헤더 이름

반환값 : HTTP응답 헤더의 값 (도착전이면 NULL)

 

ex)

if(oj.readyState == 4){

   alert(oj.getResponseHeader('Content-Type'));

}

 

10. open() : 요청을 초기화해서 HTTP 메소드 및 URL 등을 설정하는 메소드

 

서식 : oj.open(method, url,[anync[,user[,password]]])

인수 :

- method : HTTP 메소드 GET, POST

- url : 요청 URL

- async : (옵션) 비동기라면 true 동기라면 flase(생략하면 비동기: 비동기시 콜백 이벤트 사  용가능

- user : (옵션) 사용자 이름 (인증페이지에서는 이것을 생략하거나 ""로 하면 인증 대화창이 표시

- password : (옵션) 암호

 

11. send() : 요청을 송신하는 메소드

 

서식 : oj.send(body)

인수 : (body) : POST의 문자열 또는 DOMDocument, InputStream

 

ex ) "data=aaa&test=10" 을 송신합니다.

var str = 'data=aaa&test=10'

send(str);

 

 

12. setRequestHeader() : 인수로 지정한 요청 헤더를 설정하는 메소드

 

서식 : oj.setRequestHeader(header, value)

인수 : header : 검색하고 싶은 헤더 이름

         value : 설정하고 싶은 값

ex) open()한 다음 User-Agent 이름을 설정합니다.

oj.open('POST', 'http://okjsp.pe.kr/bbs1/', true);

oj.setRequestHeader("User-Agent", "MyTest0.1");

 

 

13. readyState : 요청의 처리 상태를 나타내는 프로퍼티

 

서식 : value = oj.readyState

 

readyState에 정의되어 있는 값

0  : UNINITALIZED - 오브젝트는 작성되었으나 아직 초기화 되지 않았다.

1  : LOADING - 오브젝트가 작성되었으나 아직 send메소드가 불리지 않았다.

2  : LOADED - send 메소드가 불렸지만 status와 헤더가 아직 도착하지 않았다.

3  : INTERACTIVE - 데이터 일부를 받았다.

4  : COMPLETED - 데이터 전부를 받았다. 완전한 데이터 이용 가능

 

14 . onreadystatechange : readyState 프로퍼티가 변화할때 발생하는 핸들러 함수를 실행하는 이벤트

 

서식 : oj.onreadystatechange = 핸들러 함수 이름

         function 핸들러 함수 이름() (oj){/* 이벤트 발생시의 처리 */}

         oj.onreadystatechange = function(oj){/* 이벤트 발생시의 처리 */}}

 

ex) readyState값이 "4"라면 responseText를 대화창에 표시

oj.onreadystatechange = func1

function func1(){

    if(oj.readyState == 4){

         alert(oj.responseText)

    }

}

 

위와 같은 기능을 익명 함수로 처리합니다.

oj.onreadystatechange = function(){

    if(oj.readyState == 4){

         alert(oj.responseText)

    }

}

 

위와 같은 기능을 readyState 분기 후에 콜백 함수를 만들어 처리합니다.

oj.onreadystatechange = function(oj){

    if(oj.readyState == 4){

       callback(oj)

    }

}

function callback(obj){

   alert(oj.responseText)

}

 

15. onload : 응답 헤더의 로딩을 완료 했을때 발생하여 핸들러 함수를 실행하는 이벤트

 

서식 : on.onload = 핸들러 함수 이름

         function 핸들러 함수 이름()(obj){/* 이벤트 발생시의 처리 */}

         oj.onload = function(oj){*/ 이벤트 발생시의 처리 */}

 

ex1) 로딩이 완료되면 responseText를 대화차에 표시한다.

oj.onload = funct1

function funct1(oj){

   alert(oj.responseText);

}

 

ex2) ex1과 같은 기능을 익명 함수로 처리합니다.

oj.onload = function(oj){

    alert(oj.responseText)

}

 

 

출처-http://blog.naver.com/hmjkor/140036803718