Ajax - javascript

• Asynchronous(비동기) Javascript and XML의 약어
• xml을 이용하여 비동기로 통신을 처리하기 위한 기술
• XMLhttprequest 객체 구현
• Ajax 객체 XMLHttprequest 의 속성
• status : 서버로부터 받은 응답을 나타내는 숫자 정상적이면 200

• XMLHttpRequest 객체를 통해서 비동기적 실시간 서버와 테이터를 전송하고 받는다
• 화면 refresh 없이 데이터를 서버에 전달하고 전달 받는 처리
• 브라우저에 따라서 다른 객체로 받게 된다

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30

<script>    var xmlhttp;    $(document).ready(function(){       //alert( getXHR()!= null );       $("h3").click(function(){          xmlhttp = getXHR();          // onreadystatechange:비동기처리 연결 후, 처리할 내용 선언..          xmlhttp.onreadystatechange = call;          // open(method[GET/POST],자원,async비동기여부..)          xmlhttp.open("GET","a11_data2.jsp",true);          // send 서버로 보낼내용..          xmlhttp.send(null);       });    });    function call(){       if(xmlhttp.readyState==4 && xmlhttp.status==200){          alert("받은 데이터:"+xmlhttp.responseText);          // eval : 문자열 객체화 처리..          var arr=eval(xmlhttp.responseText);          var show="<table><tr><th>이름</th><th>나이</th><th>사는곳</th></tr>";          for(var idx=0;idx<arr.length;idx++){             show+="<tr><td>"+arr[idx].name+"</td>";             show+="<td>"+arr[idx].age+"</td>";             show+="<td>"+arr[idx].loc+"</td></tr>";          }          $("div").html("<h3>받은 데이터</h3>"+show);       }    } </script> Colored by Color Scripter

cs

ㄴㄴ