<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
</body>
<script src="http://code.jquery.com/jquery-1.8.0.min.js"></script>
<script>
$.ajax({
url: "test.json", //json文件位置
type: "GET", //请求方式为get
dataType: "json", //返回数据格式为json
success: function(data) { //请求成功完成后要执行的方法
//each循环 使用$.each方法遍历返回的数据date
$.each(data.first, function(i, item) {
var str = '<div>姓名:' + item.name + '昵称：' + item.nick + '</div>';
document.write(str);
})
}
})
</script>
</html>
test.json
{
"first": [
{
"name": "王小婷",
"nick": "祈澈菇凉"
}, {
"name": "安安",
"nick": "坏兔子"
}, {
"name": "编程微刊",
"nick": "简书"
}
]
}
参考：ajax和axios请求本地json数据对比 https://www.jianshu.com/p/4b9cb79fedd5
原文作者：祈澈姑娘 关注「编程微刊」公众号 ，在微信后台回复「小程序」，获取小程序开发全套资料和500G编程资源教程。
