ajax .load()方法

1. home.html

<!DOCTYPE html>
<html>
	<head>
		<title>home</title>
		<meta http-equiv="Content-Type" content="text/html"; charset="utf-8" />
		<script type="text/javascript" src="js/jquery-1.11.3.js"></script>
		<script>
		$(function(){
			$("#dianji").click(function(){
				// console.log("test");
				// alert("testtst");
				$("#content").load("test.html");
			});
		});
		</script>
	</head>
	<body>
		<p id="dianji">点击获取load内容</p>
		<p class="comment" id="content">这里是内容</p>
	</body>
</html>

　　test.html

<div class="comment" id="test">
	<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>

　　2.可选的 callback 参数规定当 load() 方法完成后所要允许的回调函数。回调函数可以设置不同的参数：

responseTxt - 包含调用成功时的结果内容
statusTXT - 包含调用的状态

xhr - 包含 XMLHttpRequest 对象

<!DOCTYPE html>
<html>
	<head>
		<title></title>
		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
		<script type="text/javascript" src="js/jquery-1.11.3.js"></script>
		<script>
			$(function(){
				$("button").click(function(){
					$("#div1").load("tests.html",function(responseTxt,statusTxt,xhr){
						if(statusTxt=="success")
							alert("加载成功");
						if(statusTxt=="error")
							alert("加载失败"+xhr.status+":"+xhr.statusText);
					});
				});
			});
		</script>
	</head>
	<body>
		<div id="div1"><h2>使用jquery ajax 来改变文本</h2></div>
		<button>获得外部内容</button>
	</body>
</html>