<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script type="text/javascript">
//加载第一页的内容
function load1() {
$("#table1 tr").remove();
var arr = { "百度": "http://www.baidu.com", "谷歌": "http://www.google.com", "新浪": "http://www.sina.com.cn" };
$.each(arr, function (key, value) {
$("#table1").append($("<tr><td>" + key + "</td><td><a href='" + value + "'>" + value + "</a></td></tr>"));
})
}
//加载第二页的东西
function load2() {
$("#table1 tr").remove();
var arr = { "搜狗": "http://www.baidu.com", "大象": "http://www.google.com", "新浪": "http://www.sina.com.cn" };
$.each(arr, function (key, value) {
$("#table1").append($("<tr><td>" + key + "</td><td><a href='" + value + "'>" + value + "</a></td></tr>"));
})
}
//页面加载完毕后执行
$(function () {
load1();
$(".a1").click(function () {
load1();
});
$(".a2").click(function () {
load2();
});
})
</script>
</head>
<body>
<table id="table1">
</table>
<a href="javascript:void(null);" class="a1">1</a>
<a href="javascript:void(null);" class="a2">2</a>
</body>
</html>
在上面有一个知识点需要注意：$.each(arr, function (key, value) {alert(key+" "+value)});这里输出key指的数组的下标或者dictionary的key，value指的就是数组的值！如果这种情况$.each(arr, function (item) {alert(item)});这样输出的是key的值；如果是这种情况$.each(arr, function () {alert(this)});这样输出的是value，也就是数组的值.而且不仅可以使用$.each()这种方式调用，而且还可以用：jQuery对象.each（）的方式进行调用，这里each()里面只需要写成each(function(){})这样的形式就行了，其他的该怎么写还是怎么写，规则跟上面说的有一个参数两个参数和没有的参数输出的值的规则是一样的！
|
|
收藏
淘帖
踩
