티스토리 뷰

Front-end

[Ajax] 기본 문법

happii 2022. 3. 11. 18:22

▣  XMLHttpRequest(서버통신객체) xhr ▣ 

 

속성)
     readyState : 0 (아무상태아님)
                  -------요청---------------
                  1 (open메소드호출-URL요청)
                  2 (send메소드호출-파라미터전달)
                  
                  -------응답---------------
                  3 (요청한 데이터를 일부분 받는 중)
                  4 (요청한 데이터를 전체 받았을때)
                  -------------------------
     onreadystatechange : 이벤트속성(readyState값이 변경되었을때를 이벤트!!)
     status : 서버의 상태                  
                    (예==> 200:정상상태
                                  403:요청 권한 없음
                                  404:요청 페이지 없음
                                  405:요청한 메소드(doGet, doPost)가 준비되지 않았음
                                  500:요청한 페이지가 서버에서 실행 중(runtime시) 에러발생)

 

메소드)

open('HTTP요청방식', '요청URL', 비동기방식)
  

HTTP 요청방식

- get : 서버가 준비한 페이지를 주세요.  ==>  Read

- post : form안에 있는 데이터를 보내겠어요.    => Create

 

비동기방식 -> 기본이 true

 

send('요청URL에게 전달할 데이터');
           ----> send(name=홍길동&age=13)

 

 

new ActiveXObject("Msxml2.XMLHTTP");               
new ActiveXObject("Microsoft.XMLHTTP");         

new XMLHttpRequest();

httpRequest = getXMLHttpRequest();
// 콜백함수 (readystate가 변경될 때 마다 호출되는 함수명을 기술)
httpRequest.onreadystatechange = viewMessage;  
httpRequest.open("GET", url, true);
httpRequest.send(null);

httpRequest.open(httpMethod, httpUrl, true);
httpRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); //웹서버에 전송할 컨텐트타입지정       
httpRequest.onreadystatechange = callback; //호출될 콜백함수 지정
httpRequest.send(httpMethod == 'POST' ? httpParams : null);

 

위의 것을 간단하게 할 수 있다.

 

jQuery 의 ajax함수 정리

$.ajax({ key:value  });

 

최근에 올라온 글
Total
Today
Yesterday