ajaxの基本-jsチュートリアル-php.cn

ajaxの基本

巴扎黑

リリース： 2016-11-25 14:45:47

オリジナル

1188 人が閲覧しました

1つ。 ajax は非同期 JavaScript および XML です。高速で動的な Web ページを作成するために使用されるテクノロジーです。バックグラウンドでサーバーと少量のデータをやり取りすることで、Webページを非同期に更新できるため、Webページを再読み込みせずに部分読み込みを行うことができます。

2つ。オブジェクトの作成。 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 形式で取得します。

5つ。 onreadystatechange イベント。

応答ベースのタスクを実行するために使用されます。

onreadystatechange: ストレージ関数。この関数は、readyState 属性が変更されるたびに呼び出されます。

readyState: XMLHttpRequest のステータスを表します。 0から4に変化します。 3: リクエストは処理中です

4: リクエストは完了し、レスポンスの準備が整いました。

ステータス: 200: ‘OK’ 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>

ログイン後にコピー

対応するコンテンツを取得するには、ファイルのアドレスを追加する必要があります。