> 웹 프론트엔드 > JS 튜토리얼 > 아약스 기본

아약스 기본

巴扎黑
풀어 주다: 2016-11-25 14:45:47
원래의
1218명이 탐색했습니다.

1. ajax는 비동기식 JavaScript 및 XML입니다. 빠른 동적 웹 페이지를 만드는 데 사용되는 기술입니다. 백그라운드에서 서버와 소량의 데이터를 교환함으로써 웹 페이지를 비동기적으로 업데이트할 수 있어 웹 페이지를 다시 로드하지 않고도 부분 로딩을 수행할 수 있습니다.

둘. 객체 생성. XMLHttpRequest는 ajax의 기초입니다.

1. 생성 구문: new XMLHttpRequest();

2. 이전 버전 생성: new ActiveXObject("Microsoft.XMLHTTP").

셋. 서버 요청.

open(method,url,async).

메서드: 요청 유형을 나타냅니다: GET 또는 POST

url: 서버의 파일 위치.

async: true(비동기 요청) 또는 false(동기 요청).

send(string).

서버에 요청을 보냅니다.

문자열: POST 요청에만 사용됩니다. 전송되는 매개변수를

4개 나타냅니다. 서버의 응답입니다.

responseText(): 문자열 형식으로 응답 데이터를 가져옵니다. XML이 아닌 요청의 경우 responseText 속성을 사용하십시오.

responseXML(): 해당 데이터를 XML 형식으로 가져옵니다.

다섯. onreadystatechange 이벤트.

은 응답 기반 작업을 수행하는 데 사용됩니다.

onreadystatechange: 저장 함수, 이 함수는 ReadyState 속성이 변경될 때마다 호출됩니다.

readyState: XMLHttpRequest의 상태를 나타냅니다. 0에서 4로 변경됩니다.

0: 요청이 초기화되지 않았습니다

1: 서버 연결이 설정되었습니다

2: 요청이 수신되었습니다

                               ~      >           4: 요청이 완료되고 응답이 준비되었습니다.

상태: 200: '확인' 404: 페이지를 찾을 수 없습니다.

예:

<html><!DOCTYPE html>  
<html>  
<head>  
<script>  
function loadXMLDoc()  
{  
var xmlhttp;  
if (window.XMLHttpRequest)  
  {// code for IE7+, Firefox, Chrome, Opera, Safari  
  xmlhttp=new XMLHttpRequest();  
  }  
else  
  {// code for IE6, IE5  
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");  
  }  
xmlhttp.onreadystatechange=function()  
  {  
  if (xmlhttp.readyState==4 && xmlhttp.status==200)  
    {  
    document.getElementById("myDiv").innerHTML=xmlhttp.responseText;  
    }  
  }  
xmlhttp.open("GET","文件的地址",true);  
xmlhttp.send();  
}  
</script>  
</head>  
<body>  
  
<div id="myDiv"><h2>使用 AJAX 修改该文本内容</h2></div>  
<button type="button" onclick="loadXMLDoc()">修改内容</button>  
  
</body>  
</html>
로그인 후 복사


해당 콘텐츠를 얻으려면 파일의 주소를 추가해야 합니다.

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿