Ajax读取本地json文件
json
适用于现代 C++ 的 JSON。
项目地址:https://gitcode.com/gh_mirrors/js/json
免费下载资源
·
如何用Ajax读取本地JSON文件呢?
一、创建一个文件夹
里面放一个json文件,写一些数据进去,例如这样的数据:
[
{
"username" : "zhangsan",
"age" :23,
"sex":"男"
},{
"username" : "lisi",
"age" :24,
"sex":"男"
},{
"username" : "wangwu",
"age" :25,
"sex":"男"
},{
"username" : "zhaoliu",
"age" :26,
"sex":"女"
},{
"username" : "sunqi",
"age" :27,
"sex":"男"
},{
"username" : "李狗蛋",
"age" :28,
"sex":"男"
},{
"username" : "二狗子",
"age" :30,
"sex":"男"
}
]
然后再创一个index.js文件,用来写js代码,代码如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<button>获取json文件内容</button>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
// $.getJSON("json文件所在路径", function( res ){ });
$("button").click(function(){
$.getJSON("./data.json", function( res ){
console.log( res );
});
});
</script>
</body>
</html>
二、鼠标右键用Live Server打开:
注意,如果没有这个选项,那就在安装一个Live Server插件,我这里用的是vscode,如下是安装方法:
用Live Server打开后自动跳到默认浏览器中,运行效果如下:
好啦,以上就是本期内容,如果还有疑问的小伙伴请在下方留言。
GitHub 加速计划 / js / json
18
5
下载
适用于现代 C++ 的 JSON。
最近提交(Master分支:2 个月前 )
960b763e
5 个月前
8c391e04
8 个月前
更多推荐
已为社区贡献7条内容
所有评论(0)