테스트 사이트 - 개발 중인 베타 버전입니다

AJAX의 XMLHttpRequest 객체

· 6년 전 · 2003

XMLHttpRequest 객체

 

AJAX의 핵심은 XMLHttpRequest 객체입니다.

 

 

최신의 모든 브라우저는 XMLHttpRequest 객체를 지원합니다.

XMLHttpRequest 객체는 백그라운드에서 웹 서버와 데이터를 교환하는 데 사용할 수 있습니다. 
즉, 전체 페이지를 다시로드하지 않고도 웹 페이지의 일부를 업데이트 할 수 있습니다.

XMLHttpRequest 객체 만들기

모든 최신 브라우저 (Chrome, Firefox, IE7 +, Edge, Safari, Opera)에는 기본 제공 XMLHttpRequest 객체가 있습니다.

 

XMLHttpRequest 객체를 만들기위한 구문 :

variable = new XMLHttpRequest();

 


var xhttp = new XMLHttpRequest();

 

소스
<!DOCTYPE html>
<html>
<body>

<h2>The XMLHttpRequest Object</h2>

<p id="demo">Let AJAX change this text.</p>

<button type="button" onclick="loadDoc()">Change Content</button>

<script>
function loadDoc() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      document.getElementById("demo").innerHTML = this.responseText;
    }
  };
  xhttp.open("GET", "ajax_info.txt", true);
  xhttp.send();
}
</script>

</body>
</html>

 


도메인 간 액세스

보안상의 이유로 최신 브라우저는 도메인 전체에 대한 액세스를 허용하지 않습니다.

즉,로드하려는 웹 페이지와 XML 파일은 모두 동일한 서버에 있어야합니다.

W3Schools의 예제는 모두 W3Schools 도메인에있는 XML 파일을 엽니 다.

위의 예를 자신의 웹 페이지 중 하나에서 사용하려면로드하는 XML 파일을 자신의 서버에 위치시켜야합니다.

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

게시글 목록

번호 제목
15895
15894
15893
15888
15887
15886
15885
jQuery .end()
15884
15883
jQuery .each()
15882
jQuery .die ()
15881
15880
15878
15877
15876
15874
15873
15872
15871
15866
15865
15864
15863
15862
15861
15859
15858
15857
15856
15855