<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<script type="text/javascript" src="https://www.linuxidc.com/js/jquery-2.1.3.js"></script>
<style>
* { margin:0; padding:0;}
body { font-size:12px;}
.comment { margin-top:10px; padding:10px; border:1px solid #ccc;background:#DDD;}
.comment h6 { font-weight:700; font-size:14px;}
.para { margin-top:5px; text-indent:2em;background:#DDD;}
</style>
<title></title>
</head>
<body>
<input type="button" value="Ajax获取" />
<div>已有评论</div>
<div></div>
</body>
<script type="text/javascript">
$(function () {
$("#send").click(function () {
$("#resText").load("test.html .para");
});
})
/**
* 筛选载入的HTML文档
*
* load()方法的URL参数的语法结构为:"url selector",注意URL和选择器之间有一个空格
*
* load()方法的传递方式根据参数data来自动指定。
* 如果没有参数传递,则采用GET方式进行传递;
* 反之,则会自动转换为POST传递
*
* **/
</script>
</html>
load()方法---回调函数
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<script type="text/javascript" src="https://www.linuxidc.com/js/jquery-2.1.3.js"></script>
<style>
* { margin:0; padding:0;}
body { font-size:12px;}
.comment { margin-top:10px; padding:10px; border:1px solid #ccc;background:#DDD;}
.comment h6 { font-weight:700; font-size:14px;}
.para { margin-top:5px; text-indent:2em;background:#DDD;}
</style>
<title></title>
</head>
<body>
<input type="button" value="Ajax获取" />
<div>已有评论</div>
<div></div>
</body>
<script type="text/javascript">
$(function () {
$("#send").click(function () {
$("#resText").load("test.html .para", function (responseText, textStatus, XMLHttpRequest) {
alert($(this).html());
alert(responseText);//请求返回的内容
alert(textStatus);//请求状态:success、error、notmodified、timeout
alert(XMLHttpRequest);//XMLHttpRequest对象
});
});
})
/**
*
* load()方法的回调参数
*
* **/
</script>
</html>
jQuery基础教程(第4版) PDF 完整高清版+配套源码
--------------------------------------分割线 --------------------------------------