如何在没有 jQuery 的情况下在 JavaScript 中打开 JSON 文件？

Question

我正在用 JavaScript 编写一些代码。在这段代码中，我想读取一个 json 文件。该文件将从 URL 加载。

如何在 JavaScript 的对象中获取此 JSON 文件的包含内容？

例如，我的 JSON 文件位于 ../json/main.json：

{"mainStore":[{vehicle:'1',description:'nothing to say'},{vehicle:'2',description:'nothing to say'},{vehicle:'3',description:'nothing to say'}]}

我想在我的table.js 文件中使用它，如下所示：

for (var i in mainStore)
{       
    document.write('<tr class="columnHeaders">');
    document.write('<td >'+ mainStore[i]['vehicle'] + '</td>');
    document.write('<td >'+ mainStore[i]['description'] + '</td>');
    document.write('</tr>');
} 

Answer 1

JSON 与 jQuery没有任何关系。

您现在的代码没有任何问题。

---

要存储变量mainStore，就是那个json里面的一个变量。

您应该将该 json 存储到一个变量中：

var myJSON = {"mainStore":[{vehicle:'1',description:'nothing to say'},{vehicle:'2',description:'nothing to say'},{vehicle:'3',description:'nothing to say'}]};

var mainStore = myJSON.mainStore;

//.. rest of your code.

Answer 2

XHR 可以用来打开文件，但是你基本上是在让自己变得困难，因为 jQuery 让你更容易做到这一点。 $.getJSON() 让这一切变得如此简单。我宁愿只调用一行而不是试图让整个代码块工作，但这取决于你......

为什么我不想使用 jQuery 是因为我为之工作的人不想要它，因为他害怕脚本的速度。

如果他不能正确分析原生 VS jQuery，他甚至不应该编写原生代码。

害怕意味着他不知道自己在做什么。如果你打算追求性能，你实际上需要知道如何让某些代码变得更快。如果你只是认为 jQuery 很慢，那你就走错了路……

Answer 3

我理解“读取 json 文件”是指向返回 json 内容的 url 发出请求。如果是这样，那么你能解释一下为什么你不想为此目的使用 jQuery 吗？它具有 $.ajax 功能，非常适合此功能并涵盖了浏览器的差异。

如果您想读取文件，则必须在服务器端进行，例如php 并以某种方式将其提供给 dom（有不同的方法），以便 js 可以使用它。 无法使用 js 从磁盘读取文件。

Answer 4

这是一个不需要 jQuery 的示例：

function loadJSON(path, success, error)
{
    var xhr = new XMLHttpRequest();
    xhr.onreadystatechange = function()
    {
        if (xhr.readyState === XMLHttpRequest.DONE) {
            if (xhr.status === 200) {
                if (success)
                    success(JSON.parse(xhr.responseText));
            } else {
                if (error)
                    error(xhr);
            }
        }
    };
    xhr.open("GET", path, true);
    xhr.send();
}

称它为：

loadJSON('my-file.json',
         function(data) { console.log(data); },
         function(xhr) { console.error(xhr); }
);