您的位置首页百科问答

js如何读取json文件

Simone 发布于 2025-09-28 18:22:58 846 阅读

js如何读取json文件

的有关信息介绍如下：

js如何读取json文件

js如何读取json文件

先准备一个json文件

使用vscode创建一个html文件

开始撰写js方法

使用原生javascript来处理

先处理读取json文件

之后运行这个html

上一步得到的json就是我们index.json文件中的内容

在开发者工具中就能看到显示的数据

为了便于查看我们json文件的内容显示在html网页中

运行之后的效果，见下图

完成的html代码

js如何读取json文件

json文件内容

{

"person":[

{"name":"云天河","image":"tianhe.png"},

{"name":"韩菱纱","image":"lingsha.png"},

{"name":"柳梦璃","image":"mengli.png"},

{"name":"慕容紫英","image":"ziying.png"},

{"name":"云天青","image":"tianqing.png"},

{"name":"夙玉","image":"suyu.png"},

{"name":"玄霄","image":"xuanxiao.png"},

{"name":"夙瑶","image":"suyao.png"},

{"name":"太清","image":"taiqing.png"},

{"name":"宗炼","image":"zonglian.png"},

{"name":"婵幽","image":"chanyou.png"},

{"name":"奚仲","image":"xizhong.png"},

{"name":"归邪","image":"guixie.png"}

]

}

1.使用js原生 XMLHttpRequest的方法来读取json

2.将读取后的json内容打印到页面中

标签:js,json,读取