jQuery中的ajax的load()函数读取页面

时间：2017-06-13

首先介绍下load()函数：

load()函数:

函数介绍：load(url, [data], [callback]) 返回值:jQuery

参数说明：

url:待装入 HTML 网页网址。

data:（可选参数）发送至服务器的 key/value 数据。

callback:（可选参数）载入成功时回调函数。

下面进行实例演示：

首先建立需要加载的test.html文件：

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>ajax演示</title>
</head>
<body>
php点点通（www.phpddt.com）,关注php开发，提供专业web开发教程!
</body>
</html>

然后建立ajax.html文件，记得引入jquery。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>php点点通 - 关注php开发，提供专业web开发教程! </title>
<script type="text/javascript" src="./jquery-1.7.1.min.js"></script>
<script>
	$(document).ready(function(){
		$("#btn").click(function(){
			$("#result").load("test.html",function(responseText,textStatus){
				$("#display").append("<hr>responseText:"+responseText);
				$("#display").append("<hr>textStatus:"+textStatus);
			});		
		});
	});
</script>
</head>
<body>
<input type="button" value="测试" id="btn" />
<h2>显示的内容如下：</h2>
<div id="result"></div>
<h2>结果：</h2>
<div id="display"></div>
</body>
</html>

上面js代码的初始接界面:

点击测试后：结果如下图：

上一条：js实现收藏主页 下一条:js对数组元素排序

jQuery中的ajax的load()函数读取页面

相关文章

最新文章