$$config title: AJAX keywords: - JSP $$ # AJAX(Asynchronous Javascript and Xml) 빠르게 동작하는 동적인 웹 페이지를 만들기 위한 개발 기법의 하나이다. 전체페이지를 다시 로드하지 않고 지정한 부분만을 변경할 수 있다. ## code ```js

get방식의 요청

-----request_ajax.jsp----- <% out.print(request.getParameter("city")); out.print(request.getParameter("zipcode")); %> ``` ## 내용 ```js ``` 버튼을 눌러 sendRequest function이 동작하게 하였고 XMLHttpsRequest 객체를 이용하여 request_ajax.jsp?city=Seoul&zipcod한다 ```js var xhr = new XMLHttpRequest(); ``` xhr 객체를 할당 ```js xhr.open("GET", "request_ajax.jsp?city=Seoul&zipcode=456456", true); ``` get 방식 및 비동기식으로 jsp open ```js xhr.send(); ``` 전송 ```js xhr.onreadystatechange = function() ``` xhr의 상태가 바뀌면 함수 실행 ```js if(xhr.readyState == XMLHttpRequest.DONE && xhr.status == 200) ``` 호출상태값 비교 |값| 상태| 설명| |--|--|--| |0| UNSENT| 클라이언트가 생성되었습니다. open()아직 호출되지 않았습니다.| |1| OPENED| open() 호출되었습니다.| |2| HEADERS_RECEIVED| send() 호출되었으며 헤더 및 상태를 사용할 수 있습니다.| |3| LOADING| 다운로드 중; responseText부분 데이터를 보유합니다.| |4| DONE| 작업이 완료되었습니다.| 결과값 비교 정보 응답 ( 100– 199) 성공적인 응답 ( 200– 29|9) 리디렉션 메시지 ( 300– 399) 클라이언트 오류 응답 ( 400– 499) 서버 오류 응답 ( 500– 599) 결과적으로 페이지가 다시 로드 되지않고 \태그의 내부만 변환되는 것을 확인 할 수 있었다.