티스토리 뷰

IT 이야기/프로그래밍

AJAX 예제(AJAX Example)

하늘과 나b 2010. 8. 16. 01:43
AJAX 이야기

AJAX 예제(AJAX Example) 


 


<html>
 <head>
  <title>Ajax를 이용한 통신 예제
  <script type="text/javascript">
   // XMLHTTPRequest 객체 생성 함수
   function createRequest() {
    try {
     // 익스플로러 외 브라우저용
     request = new XMLHttpRequest(); 
    } catch(other) {
     try {
      // 익스플로러용
      request = new ActiceXObject("Msxml2.XMLHTTP");
     } catch (failed) {
      request = null;
     }
    }
    return request;
   }
 
   function getMessage() 
   {
    ajaxRequest = createRequest();
    if(ajaxRequest == null) {
     alert("ajaxRequest가 없습니다.");
     return;
    }

    var url = "./test1.php";
    ajaxRequest.open("GET", url, true);
    ajaxRequest.onreadystatechange = display;
    ajaxRequest.send(null);
   }

  // ajaxRequest에 의해 callback되는 함수
   function display() {
    if(ajaxRequest.readyState == 4) {
     if(ajaxRequest.status == 200) {
      var div = document.getElementById("msg");
      div.innerHTML = ajaxRequest.responseText;
     }else if(ajaxRequest.status == 404) {
      alert("요청하신 페이지를 찾을 수 없습니다.");
     }
    }
   }
  </script>
 </head>


 <body>
  <input type="button" value="요청" onclick="getMessage()"/><br />
  서버에서 수신한 데이터 : <div id="msg"></div>
 </body>
</html>

'IT 이야기 > 프로그래밍' 카테고리의 다른 글

[C언어 이야기] C언어의 기본  (0) 2010.12.08
[CSS] 스타일시트 2편 - 스타일의 우선순위와 셀렉터 사용법  (0) 2010.08.24
[CSS] 스타일시트 1편 - 스타일 시트(Style Sheet)란?  (0) 2010.08.23
HTML의 시작  (0) 2010.08.16
AJAX #1. AJAX 소개(AJAX Introduction)  (0) 2010.08.16
HTML 그 두번째 이야기  (0) 2010.08.15
HTML 글씨에 효과주기  (0) 2010.08.15
AJAX 예제. 파일 읽어서 화면에 출력하기  (0) 2010.08.15
AJAX 예제. XML 파일 읽어서 출력하기  (4) 2010.08.15
[Javascript] 마우스 금지 소스  (0) 2010.08.15
공유하기 링크
댓글