当前位置: 首页 > 工具软件 > json2html > 使用案例 >

HTML引用外部json文件

申屠乐池
2023-12-01

我是在hubuilder里试的,先是新建data.json文件。里面写上内容。其中var dataFromJSON是为了方便引用。

var dataFromJSON = {
                "text":"外部json",
                "iconCls":"fa fa-wpforms",
                "state":"open",
                "children":[{
                    "section_id":1,
                    "text":"第一节”
                },{
                    "text":"第二节"
                    }]
                }

在页面添加如下引用,之后就能在此页面使用dataFromJSON数据,

<script type="text/javascript" src="data/data.json"></script>

console.log(dataFromJSON)

但是在idea里新建的json文件,不能用这种方法,不能给json文件里的数据定义名称,所以换成用ajax,要注意通过这种的json,会在数组元素里的前面加上序号,作为其key值,这样处理起来会有些麻烦。

$.ajax({
    type : "GET",//使用get请求请求正确
    url : "data..json",
    dataType:"json",
    //data:
    success : function(data) {
        console.log("data: "+ JSON.stringify(data[0]))
    },
    error : function() {
        alert("请求失败")
    }
})

 

 类似资料: