AJAX란 무엇입니까?


HTML

AJAX는 다음을 할 수 있기 때문에 개발자의 꿈입니다.

  • 웹 서버에서 데이터 읽기 - 웹 페이지가 로드된 후
  • 페이지를 새로고침하지 않고 웹페이지 업데이트
  • 웹 서버에 데이터 보내기 - 백그라운드에서

AJAX 예제

Let AJAX change this text


AJAX 예제 설명

HTML 페이지

<!DOCTYPE html>
<html>
<body>

<div id="demo">
  <h2>Let AJAX change this text</h2>
  <button type="button" onclick="loadDoc()">Change Content</button>
</div>

</body>
</html>

HTML 페이지에는 <div> 섹션과 <button>이 있습니다.

<div> 섹션은 서버의 정보를 표시하는 데 사용됩니다.

<버튼>은 기능을 호출합니다(클릭된 경우).

이 함수는 웹 서버에서 데이터를 요청하고 표시합니다.

함수 loadDoc()

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();
}


AJAX란 무엇입니까?

AJAX = 동기 JavaScript A X ML .

AJAX는 프로그래밍 언어가 아닙니다.

AJAX는 다음 조합을 사용합니다.

  • 브라우저 내장 XMLHttpRequest 객체(웹 서버에서 데이터를 요청하기 위해)
  • JavaScript 및 HTML DOM(데이터 표시 또는 사용)

AJAX는 오해의 소지가 있는 이름입니다. AJAX 애플리케이션은 XML을 사용하여 데이터를 전송할 수 있지만 데이터를 일반 텍스트 또는 JSON 텍스트로 전송하는 것도 마찬가지로 일반적입니다.

AJAX를 사용하면 배후에서 웹 서버와 데이터를 교환하여 웹 페이지를 비동기식으로 업데이트할 수 있습니다. 즉, 전체 페이지를 다시 로드하지 않고도 웹 페이지의 일부를 업데이트할 수 있습니다.


AJAX 작동 방식

아약스

  • 1. 웹페이지에서 이벤트 발생(페이지 로딩, 버튼 클릭)
  • 2. XMLHttpRequest 객체는 JavaScript에 의해 생성됩니다.
  • 3. XMLHttpRequest 객체는 웹 서버에 요청을 보냅니다.
  • 4. 서버가 요청을 처리합니다.
  • 5. 서버는 웹 페이지에 응답을 다시 보냅니다.
  • 6. 응답은 JavaScript에서 읽습니다.
  • 7. 페이지 업데이트와 같은 적절한 조치는 JavaScript에 의해 수행됩니다.

전체 AJAX 튜토리얼

AJAX에 대한 간략한 설명입니다.

전체 AJAX 튜토리얼을 보려면 W3Schools AJAX 튜토리얼로 이동하십시오 .

더 많은 AJAX 예제를 보려면 W3Schools AJAX 예제로 이동하십시오 .