首页 前端知识 在js脚本中直接引入本地json文件

在js脚本中直接引入本地json文件

2024-02-02 09:02:01 前端知识 前端哥 798 451 我要收藏

遇到一个需要引入本地json文件的问题,同时又不能使用jQuery包

首先需要在本地创建json文件

 

 在json中定义一个对象保存数据

var jsonData2 = {
    "businessCode": "success",
    "count": 4,
    "currentTime": 1658386745555,
    "description": "",
    "resultSet": [
        {
            "id": 1488,
            "code": "media_80522792-f192-4f11-b824-3cd9436ac17f",
            "name": "新大头儿子小头爸爸 第二季",
            "genreCode": "genre_a6325b19-85d2-48bf-a793-1501c48c8ca9",
            "currentEpisodeNumber": 102,
            "type": "103",
            "template": null,
            "img1": null,
            "img2": "./movie1.png",
            "img3": null,
            "mark": null,
            "seq": 1617950689,
            "tag": null,
            "cp": null,
            "playTimes": null,
            "score": null,
            "fee": 1,
            "desc": "一个中国典型的三口之家,八零后的父母——小头爸爸和围裙妈妈,一个调皮可爱的的大头儿子。他们生活在现代化的城市中,过着平凡并充满乐趣的生活。 ",
            "param2": "20000002000000000000000006699471",
            "param6": 12,
            "param7": 28,
            "param8": "0013",
            "param9": 6,
            "param10": 102
        }
    ]
}

有些json文件格式可能会提示报错,类似这种

 但不需要管他,也不需要导出实例

在HTML脚本中使用导入js文件的方法将json文件导入即可使用,要注意json文件和js文件的先后顺序,json文件一定要在要调用json文件的js脚本之前

<script type="text/javascript" src="../jsonData2.json"></script>
<script type="text/javascript" src="./index.js"></script>

 接下来就可以在index.js里面直接调用json文件里定义的对象

var bookList = [];
            for (var i = 0; i < jsonData2.resultSet.length; i++) {
                if (jsonData2.resultSet[i]) {
                    bookList.push(jsonData2.resultSet[i])
                }
            }

我这边是直接自己将数据分割了,也可以用JSON.parse()方法

转载请注明出处或者链接地址:https://www.qianduange.cn//article/1111.html
标签
json
评论
发布的文章

Ajax用法总结

2024-02-14 09:02:07

JQuery之jsTree树形插件

2024-02-14 09:02:01

Why React Doesn‘t Need jQuery?

2024-02-14 09:02:00

jQuery模板字符串

2024-02-14 09:02:58

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!