$.each 和 for循环
记得引入 jquery目录要对
1.html 页面
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div class="alert"></div>
<ul class="list">
</ul>
<input type="button" id="btn" value="请求数据">
<input type="button" id="clear" value="清除数据">
<script type="text/javascript" src="../public/js/jquery-2.0.3.min.js"></script>
<script>
$(function(){
$("#btn").click(function(){
$.ajax({
type:"get",
dataType:"json",
url:"data.json",
// data:{},
success:function(res){
$(".alert").html("请求成功")
var html='';
//第一次方式
// $.each(res,function(i,v){
// html+="<li data-id="+v.id+">"+v.name+"</li>"
// })
//第二次方式
for(var i=0;i<res.length;i++){
html+="<li data-id="+res[i].id+">"+res[i].name+"</li>"
}
$(".list").html(html)
},
error:function(){
$(".alert").html("请求失败")
}
})
})
$("#clear").click(function(){
$(".list").html("")
$(".alert").html("")
})
})
</script>
</body>
</html>