Javascript 기초 (8) Ajax 소개

1. XML HttpRequest 대상 (IE5 와 IE6 에서 ActiveXObject 대상): a. 역할: 배경 서버 와 데 이 터 를 교환 하 는 데 사용 합 니 다.b. 생 성:

        variable = new XMLHttpRequest();                    //          
        variable = new ActiveXObject("Microsoft.XMLHTTP");  //IE6  

c. 서버 에 요청 보 내기: XML HttpRequest 대상 은 open () 과 send () 두 가지 방법 이 있 습 니 다.문법 은:

        open(method,url,async)  : xmlhttp.open("GET","ajax_info.html",true);
        send("   ");

예:

        xmlhttp.open("GET","demo_get2.html?fname=Henry&lname=Ford",true);
        xmlhttp.send(); //   get   

        xmlhttp.open("POST","ajax_test.html",true);
        xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
        xmlhttp.send("fname=Henry&lname=Ford");  //   post   

구분: 세 번 째 인자 async 는 비동기 실행 여 부 를 설정 하 는 데 사 용 됩 니 다. true 와 false 두 가지 만 async = true 를 사용 할 때 onreadystatechange 이벤트 의 준비 상태 에 응답 할 때 실행 하 는 함 수 를 async = false 를 사용 할 때 onreadystatechange 함수 - 코드 를 send () 문 뒤에 두 지 않 아 도 됩 니 다.
d. 서버 응답 획득: XML HttpRequest 대상 의 두 속성 사용:

         ① responseText  //            
         ② responseXML   //  XML       

2. onready statechange 이벤트 가 서버 에 보 내 기 를 요청 할 때 응답 기반 작업 을 수행 해 야 합 니 다.ready State 속성 이 바 뀌 었 을 때 이 사건 을 촉발 합 니 다. XML HttpRequest 는 세 가지 중요 한 속성 이 있 습 니 다. ① onready statechange 저장 함수 ② ready State 요청 의 상태: 0 1, 2, 3 4 가지 서로 다른 상태 입 니 다. 예 를 들 어 4: 요청 이 완료 되 었 고 응답 이 완료 되 었 음 을 표시 합 니 다.③ status 상태: 200 또는 404, 200 은 ok, 404 는 페이지 를 찾 을 수 없 음
3. 반전 함수: 한 함 수 를 매개 변수 로 다른 함수 에서 사용 합 니 다.
AJAX 의 기본 원 리 를 정리 합 니 다. 우선, XML HttpRequest 대상 을 이용 하여 서버 에 요청, open, send 방법 을 보 낸 다음 에 서버 에서 요청 (예 를 들 어 일부 매개 변수) 을 가 져 온 다음 응답 을 합 니 다. response. getWriter () 를 이용 하여 전단 에 파 라 메 터 를 출력 합 니 다. 마지막 으로 전단 js 는 XML HttpRequest 를 통 해 요청 상 태 를 먼저 판단 하여 4 와 200 을 만족 시 킨 후,이 대상 의 responseText 속성 을 통 해 서버 의 응답 을 얻 고 이 응답 에 따라 어떤 동작 을 할 지 결정 합 니 다.
JSP Servlet Ajax 응용 예시:http://wandering192.iteye.com/blog/736136