欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

本地写json数据并在页面中调用

程序员文章站 2022-05-14 21:54:54
...

这里我自己写的是两个方法,一种是用js文件中写的,一种是在json文件中写的。

js文件:

var workData = {
    "firstWork":{
        "companyName":"",
            "time":"",
            "department":"",
            "position":"",
            "project":[
            {
                "name":"",
                "time":"",
                "content":"",
                "technology":""
            }
        ]
    },
    "secondWork":{
        "companyName":"",
            "time":"",
            "department":"",
            "position":"",
            "project":[
            {
                "name":"",
                "time":"",
                "content":"",
                "technology":""
            }
        ]
    },
    "thirdWork":{
        "companyName":"",
            "time":"",
            "department":"",
            "position":"",
            "project":[
            {
                "name":"",
                "time":"",
                "content":"",
                "technology":""
            }
        ]
    },
    "fourthWork":{
        "companyName":"",
            "time":"",
            "department":"",
            "position":"",
            "project":[
            {
                "name":"",
                "time":"",
                "content":"",
                "technology":""
            }
        ]
    }
}

可以在html文件中调用    <script src="路径 + json.js"></script>      之后可以用console.log(workData)看一下,可以成功调用。

json文件:

{
  "firstWork":{
    "companyName":"",
    "time":"",
    "department":"",
    "position":"",
    "project":[
      {
        "name":"",
        "time":"",
        "content":"",
        "technology":""
      }
    ]
  },
  "secondWork":{
    "companyName":"",
    "time":"",
    "department":"",
    "position":"",
    "project":[
      {
        "name":"",
        "time":"",
        "content":"",
        "technology":""
      }
    ]
  },
  "thirdWork":{
    "companyName":"",
    "time":"",
    "department":"",
    "position":"",
    "project":[
      {
        "name":"",
        "time":"",
        "content":"",
        "technology":""
      }
    ]
  },
  "fourthWork":{
    "companyName":"",
    "time":"",
    "department":"",
    "position":"",
    "project":[
      {
        "name":"",
        "time":"",
        "content":"",
        "technology":""
      }
    ]
  }
}

可以使用ajax来调用

$.ajax({
    url: "路径 + 名称.json",//json文件位置
    type: "post",
    dataType: "json", //返回数据格式为json
    success: function(data) {//请求成功完成后要执行的方法
        console.log(data)
    }
})

 

相关标签: 原创