무료팩스 › chrome › jEdit › TheWinnerTakesItAll › HelpOnPageCreation › ajax
- Ajax(Asynchronous JavaScript and XML)
- 동적인 웹화면 구성을 위한 개발 기법
DOM
1.1 일단 하나 만들어 보자 #
어떤걸 만들까?
서버에서 메시지를 가져오는 간단한 테스트를 만들어봤습니다.
중요한건 클라이언트쪽 소스입니다. 소스보기하면 다 보일거구요.
서버쪽은 별거 없습니다. 그냥 3초정도 대기하다가 메시지를 뿌려주는 것밖에...
그리고 그 메시지를 클라이언트 브라우져에 동적으로 표시해줍니다.
- 클라이언트쪽 html 소스
<script> var xmlhttp; function getMessage() { document.getElementById("btnGM").disabled = true; xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); xmlhttp.onreadystatechange = onreadystatechangeEH xmlhttp.open("GET", "/comnote/web/ajax/ajaxTest_getMessage.jsp", true); xmlhttp.send(); } function onreadystatechangeEH() { if(xmlhttp.readyState){ document.getElementById("statusCode").innerText = xmlhttp.readyState; } if(xmlhttp.readyState == 4){ if (xmlhttp.status == 200) document.getElementById("result").innerText = xmlhttp.responseText; document.getElementById("statusText").innerText = xmlhttp.statusText; } } </script> xmlhttp.readyState : <div id="statusCode"></div> xmlhttp.statusText : <div id="statusText"></div> xmlhttp.responseText : <div id="result"></div> <input type="button" id="btnGM" onClick="getMessage()" value="get message">
- 서버쪽 jsp 소스
<% try{ Thread.sleep(3000); } catch(Exception e){} out.println("HI~ gimslab.com "+new java.util.Date()); %>