JSON +的Javascript / jQuery的。 如何从json文件导入数据并解析它？

如果我有一个名为names.json的JSON文件：

 {"employees":[ {"firstName":"Anna","lastName":"Meyers"}, {"firstName":"Betty","lastName":"Layers"}, {"firstName":"Carl","lastName":"Louis"}, ]} 

如何在javascript中使用其内容？

Answer 1

如何执行此操作的示例可以是：

Answer 2

您的JSON文件不包含有效的JSON。 请尝试以下方法。

  { "employees": [ { "firstName": "Anna", "lastName": "Meyers" }, { "firstName": "Betty", "lastName": "Layers" }, { "firstName": "Carl", "lastName": "Louis" } ] } 

然后你应该看到一个回应。 查看http://jsonlint.com/

Answer 3

您可以在HTML中包含一个Javascript文件，将JSON对象声明为变量。 然后，您可以使用data.employees从全局Javascript范围访问JSON数据。

index.html的：

data.js：

 var data = { "employees": [{ "firstName": "Anna", "lastName": "Meyers" }, { "firstName": "Betty", "lastName": "Layers" }, { "firstName": "Carl", "lastName": "Louis" }] } 

Answer 4

在jQuery代码中，您应该拥有employees属性。

 data.employees[0].firstName 

所以它会是这样的。

当然，你也需要非jQuery版本的属性，但你需要先解析JSON响应。

还要记住， document.write正在破坏整个页面。

---

如果您仍然遇到问题，请尝试使用完整的$.ajax请求而不是$.getJSON包装器。

  $.ajax({ url: "names.json", dataType: "json", success: function(data) { console.log(data); $('body').append(data.employees[0].firstName); }, error: function(jqXHR, textStatus, errorThrown) { console.log('ERROR', textStatus, errorThrown); } }); 

http://api.jquery.com/jquery.ajax/

Answer 5

如果你想使用PHP。

（可选）使用异步：

PHP：

Answer 6

我知道很久以前给出了答案，但这个结果显示在google上的第一个位置。

但是我不想使用jquery，所以在vanilla JS中， 我发现这个快速教程比senornestor更清晰（它还允许根据变量加载文件）：

 function loadJSON(filelocation, callback) { var xobj = new XMLHttpRequest(); xobj.overrideMimeType("application/json"); xobj.open('GET', filelocation, true); // Replace 'my_data' 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); } function init() { var location = "myfile.json"; loadJSON(filelocation=location, function(response) { // Parse JSON string into object loadedJSON = JSON.parse(response); console.log(loadedJSON.somethingsomething); }); } init(); 

并在您的HTML文件上：

 ``