jQuery の ajax technology_jquery の詳細な紹介

1：Ajax技术包含以下几点：
基于Web标准(XHTML + CSS)的展示
使用DOM进行动态显示和交互
使用XMLHttpRequest进行数据交换和相关操作
使用javascript将所有内容绑定在一起
Ajax的核心是JavaScript的XMLHttpRequest对象，它是一种支持异步请求的技术。简而言之，使用JS可以控制XMLHttpRequest对象向服务器提出请求并处理响应，
而不影响用户对页面的正常访问。对于XMLHttpRequest对象，不同的浏览器提供了不同的支持，IE是将其作为ActiveX控件集成到浏览器中的，而其他主流的浏览器直接
作为一般的JS对象来创建。

2：JS中的Ajax

XMLHttpRequest对象的属性及简要说明

名称	说明
readyState	通信的状态，当XMLHttpRequest对象把一个HTTP请求发送到服务器，到接收到服务器响应信息，整个过程将经历5种状态，该属性取值为为0-4
onreadystatechange	设置回调事件处理程序，当readyState属性的值改变时，会激发此事件
responseText	服务器返回的text/html格式的文档
responseXML	服务器返回的text/xml格式的文档
status	描述了HTTP响应short类型的状态代码，100表示Continue, 101表示Switching protocols数据交换，200表示执行正常，404表示未找到页面，500表示内部程序错误
statusText	HTTP响应的状态代码对应的文本(OK, not found)

readyState属性代码

代码	说明
0	代表未初始化的状态。创建了一个XMLHttpRequest对象，尚未初始化
1	代表连接状态，已经调用了open方法，并且已经准备好发送请求
2	代表发送状态，已经调用了send方法发出请求，尚未得到响应结果
3	代表正在接收状态，已经接收了HTTP响应的头部信息，正在接收响应内容
4	代表已加载状态，此时响应内容已完全被接收

复制代代码如下:

Ajax

< ;/body>

ajax.js の内容：

复制代 代码如下:

var xmlRequest;
function CreateRequest()
{
/* 创建XMLHttpRequest对象 */
if( window.ActiveXObject)
{
return new ActiveXObject("Microsoft.XMLHTTP");
}
else if(window.XMLHttpRequest)
{
return new XMLHttpRequest();
}
}
function ResponseHandler()
{
if(xmlRequest.readyState == 4 && xmlRequest.status == 200)
{
/* 如果通信成功，また、正常に、以下の操作を実行します */

var reqContent = xmlRequest.responseText;
document.getElementById("browser").innerHTML = reqContent;
document.getElementById("content")。 value = reqContent;
}
}
function AjaxAccess()
{
/* 异步请求百度首页 */

xmlRequest = CreateRequest();  //XMLHttpRequest对オブジェクト
xmlRequest.onreadystatechange = ResponseHandler;  //设置回调関数
xmlRequest.open("GET","http://www.baidu.com");  //初化请要求对象
xmlRequest.send(null);   //送信请求信息

/* 触発イベント後の提案正在打开百度首页 */
var brow = document.getElementById("browser");
brow.innerHTML = "

;正在打开百度搜索

";
}
window.onload = function()
{
document.getElementById("Access").onclick = AjaxAccess;  //設置按扭单击イベント
}

3：jQuery 中の Ajax
$.ajax(options) ) メソッド
オプションは、「鍵/値」対の形式で設定され、要求方式、要求URL、戻り関数などの Ajax 要求のパラメータを設定するために使用されます。
常用プロパティ例:
url:送信要求の地址
type:送信要求方式、GET および POST、默认は GET
timeout: 設定要求時間、このプロパティは数値型、単位は秒です
data: サーバーに送信されるデータ、「键/值」形式、このプロパティはオブジェクトまたは文字列である場合があります。これはオブジェクトであり、自動変換は文字列
dataType: 予定サーバーから返されるデータ型であり、このプロパティは文字列型です。的标签(script标签または者スタイル标签) 会
文本插入DOMの時候行行、 script：返纯文本JS代码、json、jsonp、text
contentType: 送信メッセージ至サービス器時コンテンツコード型、このプロパティは文字列型、許可は "application/x-www-form-urlencoded"、一般に不使用の設定、ため、ほとんどのアプリケーションと一致
beforeSend: 要求送信されたイベント、そのプロパティは、イベント処理プログラムを設定し、前に修正ＸＭＬＨｔｔｐＲｅｑｕｅｓｔのパラメータ（例えば、ブロック情報）を送信するために使用され得る。
代码如下:

function(XMLHttpRequest) {
this; /*このキーワードは、.ajax() メソッドのオプション パラメーター オブジェクトにアクセスするために使用されます*/
}
complete: リクエストが完了した後のイベント、リクエストが成功したかどうかに関係なく、このイベントがトリガーされます。
function(XMLHttpRequet, textStatus) {
this; /*このキーワードは .ajax() メソッドのオプション パラメーター オブジェクトにアクセスするために使用されます*/
}
textStatus パラメーターは実行ステータスを返します現在のリクエストの内容 (成功やエラーなど)
success: リクエストが正常に実行されたときのイベント。
function(data, textStatus) {
this; /*このキーワードは、.ajax() メソッドのオプション パラメーター オブジェクトにアクセスするために使用されます*/
}
error: リクエストの実行が失敗した場合のイベント
function(XMLHttpRequest, textStatus, errorThrown) {
this; /*このキーワードは、.ajax() メソッドのオプション パラメーター オブジェクトにアクセスするために使用されます*/
}
global: グローバル Ajax イベントをトリガーするかどうか。この属性はブール型で、デフォルト値は false

コードをコピー コードは次のとおりです:

$(document).ready(function(){
$("#Access").click (function(){
var xmlReq = $.ajax({
type:'GET',
url:'http://www.sougou.com',
success:function(reqContent )
$("#browser").html(reqContent);
$("#content").text(reqContent);
}});
$("#browser") .html("< ;h1>総合検索を開く");
});
});

4: ロードメソッド
load(url, [data], [callback]);

コードをコピー コードは次のとおりです次のように:

body {padding:20px; }
#commentList{ border:solid 2px #888; overflow:auto; -bottom:solid 1px; margin-bottom:30px; font-size:13px; }
#commentList div{ }
#commentList h3{ color:# 888; 銉戙儑銈ｃ兂銈