jQuery开发之Ajax

1。load()方法
(1)load()方法是jQuery中最经常使用和最简单的Ajax方法，能载入远程HTML代码，并插入代码中。

它的结构为：

load(url [,data] [,callback])

load()方法解释例如以下表所看到的

这里写图片描写叙述

演示样例代码例如以下：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GB18030">
<title>jQuery test </title>
<script type ="text/javascript" src ="jquery.js" ></script>
<link href="styles.css" rel="stylesheet" type="text/css" />
<script type ="text/javascript">
$(document).ready(function(){


    $("#send").click(function(){
        $("#resText").load("test.html");


    });



});

</script>
</head>
<body>

<div class ="comment">
<h6>张三：</h6>
<p class ="para">沙发</p>
</div>
<div class ="comment">
<h6>李四：</h6>
<p class ="para">板凳</p>
</div>
<div class ="comment">
<h6>王五：</h6>
<p class ="para">地板</p>
</div>
<input type ="button" id ="send" value ="Ajax获取" />
<div class ="comment">已有评论:</div>
<div id = "resText"></div>


</body>
</html>

执行效果：
没有单击button的时候
这里写图片描写叙述
单击button后

(2) 筛选载入的html文档
核心代码例如以下：

$("resText").load("test.html .para")

执行效果例如以下：
这里写图片描写叙述

(3)传递方式
load()方法的传递方式依据data来自己主动指定。假设没有參数传递。则採用 GET方式传递。反之，则採用POST方式。演示样例代码例如以下：

无參数传递是get方法
$("resText").load("test.php",function(){

})


$("resText").load("test.php",{name:"rain",age:"22"},function(){

})

(4) 回调參数
对于必须在载入完毕后再能进行的操作。load()方法提供了回调函数(callback),该函数有三个參数分别代表请求返回的内容，请求状态和XMLHttpRequest对象，jQuery代码例如以下：

$("resText").load("test.php",function(responseText,textStatus,XMLHttpRequest){
//responseText    返回的内容
//textStatus    请求状态  success, error, notmodified,timeout
//XMLHttpRequest对象
})

2。$.get()方法和$.post()方法
$.get()方法使用GET方法进行异步请求。

它的结构为：

$.get(url [,data] [,callback] [,type])

參数解释例如以下：
这里写图片描写叙述

$.post() 方法演示样例代码例如以下：
这里写图片描写叙述

3，$.getScript()方法和$.getJson()方法
(1), 有时候，在页面初次载入时取得所需的所有javaScript()文件是全然没有必要的。尽管能够在须要哪个 JavaScript的时候，动态的创建<script> 标签。jQuery代码例如以下：

$(document.createElement("script")).attr("src","test.js").appendTo("head");

或者

$("<script type ='text/javaScript' src ='test.js'/>").appendTo("head");

用$.getScript() 更加的简单

$.getScript("test.js")

(2) $.getJson()方法
jQuery演示样例代码例如以下：
这里写图片描写叙述

这里写图片描写叙述

(4) $.ajax()方法

$.ajax() 方法是jQuery中Ajax的最底层实现。结构为：

$.ajax(options)

參数说明例如以下：
这里写图片描写叙述

这里写图片描写叙述
演示样例代码例如以下：

$(function(){
$("send").click(function(){
$.ajax({
type:"GET",
url:"test.js",
dataType:"script"
});
});
})

jQuery中Ajax全局事件还有其它几种。例如以下：
这里写图片描写叙述
注意：