<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!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=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="../jquery-1.8.3.js"></script>
<script type="text/javascript">
$(function(){
//1、创建Ajax的方式,可以直接为包装器创建,这样,ajax之后的内容会自动加载到包装器中
/*
在URL中可以通过空格来插入相应的选择器,以下表示去01.html页面中获取id为c的元素加载进来
*/
//$("#content").load("01.html #c");(如果没有#c就是加载整个的HTML文档)
//当使用了第二参数传值 之后,就自动转换为post请求(如果想用get方式那么就在01.html后面加入?参数名= 参数值 (多参数用&隔开))
$("#content").load("01.html",{id:11},function(data){
//function这个回调函数表示,加载完成之后的一些处理方式
//1、已经是完成了对content这个内容的处理之后才会调用该函数
//alert(data);(打印出来的值是html内容)
/*
特别注意以下讲解:
首先data是一个html类型的值,通过$(data)之后,会讲这个值包装为JQuery对象
(最开始的时候我以为 01.html 后面加入#c后就data应该是过滤后的东西,结果不是还是html文档的完整内容,但是加入到#content的东西是过滤过的!)
在jQuery中包装一个document是这样来处理,会将所有body中的根节点包装到包装器中
*/
/*
<h1>哈哈哈!加载成功</h1>
<div id="c">
呵呵呵!加载成功
<div id="c1">
这个是C1中的内容
</div>
</div>
*/
//如果要获取h1的值,因为h1是根对象,会被包装到包装器中,只能通过filter来获取
alert($(data).filter("h1").html());
//id为c1的元素是包装器中的元素,所以需要通过find来获取
alert($(data).find("#c1").html());
alert($(data).filter("#c").html());
});
});
</script>
</head>
<body>
<h1>使用JQuery实现Ajax</h1>
<div id="content"></div>
</body>
</html>
(打印出整个HTML)
(html方法是打印出匹配元素的内容,现在C里面的内容的div什么的业给弄了出来,而H1里面只有文字所以,如果不想要c1里面的div等这个时候你用text()方法就好,还有救是html只能用在html里面,text html 和XML都可以用)
-------------------------------------------------------------------------------------------------------------------------------分割------------------------------------------------------------------------------------------
/*$.get("02.xml",function(data) {
//如果使用的返回类型是xml的话,data就是一个xml的元素
//alert(data.getElementsByTagName("h1").length);
//如果处理的是xml只能通过text来去元素,不支持html()取元素
//特别注意:得到的值不会把根对象包装在包装器中,都需要通过find来找元素,这和前面的load事有区别的
alert($(data).find("person").text());
},"xml");*/
(这就是传说中的get方法了,这个与load的区别是他不在需要你用一个包装集去调用,用全局的$,就能调用,然后如果是XML方式,那么02.xml必须是一个标准的xml)