Javascript 使用外部json

我是json的初学者，所以需要一些帮助！ 我有一个附加在html文件中的外部json文件，其中包含以下代码：

{
"reports": [{
        "id": "1",
        "name": "week",
        "type": "bar",
        "size": 12288
    }, {
        "id": "2",
        "name": "month",
        "type": "line",
        "size": 242688
    }]
}

还有另一个附加的外部js main.js。例如，我想在main.js中读取数组中json文件中的数据！我该怎么办？我没有任何权限更改json文件

：我必须使用纯js！

---

使用纯Javascript的解决方案

var listreports = new Array();
function init() {
loadJSON(function(response) {
  // Parse JSON string into object
    var actual_JSON = JSON.parse(response);

    for (var prop in actual_JSON){
        tepObj = actual_JSON[prop]; // this is loop into reports, if you have reports2 will be inside
        for (var rep in tepObj){
            temprep = tepObj[rep];
            console.log(temprep)
            var report = new Object();
            report.id = temprep.id
            report.name= temprep.name
            report.type= temprep.type
            report.size= temprep.size
            listreports.push(report);
            console.log(report)
        }

    }
    console.log(listreports);
 });
}


 function loadJSON(callback) {   

    var xobj = new XMLHttpRequest();
        xobj.overrideMimeType("application/json");
    xobj.open('GET', 'test.json', true); // Replace 'test' with the path to your file
    xobj.onreadystatechange = function () {
          if (xobj.readyState == 4 && xobj.status == "200") {
            // Required use of an anonymous callback as .open will NOT return a value but simply returns undefined in asynchronous mode
            callback(xobj.responseText);
          }
    };
    xobj.send(null);  
 }


init(); //this is only to call the function.

使用Jquery的第一个解决方案

试试这个

var reports = new array()
$.getJSON( "folder/file.json", function( data ) {
}).success(function(data){
   for (var prop in data){
   temprep= data[prop]
   report.id = temprep.id
   report.name= temprep.name
   report.type= temprep.type
   report.size= temprep.size
   reports.push(report)
  });

---

然后，您将拥有一个包含json的对象数组

如果我理解正确，您有一个包含json的文件和另一个包含主javascript的文件，如果这是正确的，那么您需要将json文件放在html中main.js文件的上方

然后您将能够从main.js获取json，因为当main.js加载时，json文件已经加载，如果html中main.js在json文件之前，那么您将无法从main.js获取json

编辑：您的HTML头应该如下所示：

<script src="json.js"></script>
<script src="main.js"></script>

---

如果以所显示的格式加载json文件，则json对象不会存储到变量中

将json文件更改为：

var reports = {
"reports": [{
        "id": "1",
        "name": "week",
        "type": "bar",
        "size": 12288
    }, {
        "id": "2",
        "name": "month",
        "type": "line",
        "size": 242688
    }]
};

---

您可以使用ajax请求将JSON文件存储在main.js中的变量中：

var xhReq = new XMLHttpRequest();
xhReq.open("GET", ***here the url to your JSON file***, false);
xhReq.send(null);

然后，您可以将该JSON字符串解析为Javascript对象，以便根据需要作为数组进行操作

var jsonObject = JSON.parse(xhReq.responseText);

---

什么意思，附件？在客户端读取数据的唯一方法是通过AJAX。在web应用程序中读取数据是什么意思？网站？html文件？什么？@Amadan我是说linked！您想用json做什么？显示它？@Alex看到我的json了吗！我想要一个像myreport这样的数组，用json显示我的数据。与myreport[1]类似。id=1；！哦对不起，我忘了！我必须使用纯js！这意味着在这些之后我有了listreports[0]。id？还是怎样tnxyes，此对象的数组。然后您可以使用listreports[0]访问它。i确实要吗？因为我使用了alertlistreports[0]。id，但什么都没有发生！甚至警报框也没有显示！100%查看屏幕截图，在控制台中会出现哪个错误？对的我做了这些！我不知道这样做的语法！我说我不能更改json文件！

var jsonObject = JSON.parse(xhReq.responseText);