Как я могу открыть файл JSON в JavaScript без jQuery?

Question

Я пишу код на JavaScript.В этом коде я хочу прочитать файл JSON.Этот файл будет загружен с URL.

Как я могу получить содержимое этого JSON-файла в объекте в JavaScript?

Это, например, мой 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

Вот пример, который не требует 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); }
);

Answer 2

XHR можно использовать для открытия файлов, но тогда вы в основном усложняете себе задачу, потому что jQuery делает это намного проще для вас.$.getJSON() делает это так легко сделать.Я бы предпочел вызвать одну строку, чем пытаться заставить работать весь блок кода, но это зависит от вас ...

Почему я не хочу использовать jQuery, потому что я человекработать не хочет этого, потому что боится скорости скрипта.

Если он не может правильно профилировать нативный VS jQuery, ему даже не стоит программировать нативный код.

Бояться - значит, он не знает, что делает.Если вы планируете повысить производительность, вам действительно нужно знать, как увидеть, как сделать некоторые фрагменты кода быстрее.Если вы просто думаете, что jQuery работает медленно, то вы идете по неправильным дорогам ...

Answer 3

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 4

Я понимаю, что под "чтением файла json" вы подразумеваете отправку запроса на URL, который возвращает содержимое json. Если да, то можете ли вы объяснить, почему вы не хотите использовать jQuery для этой цели? Он имеет функцию $ .ajax, которая идеально подходит для этого и покрывает различия браузеров.

Если вы хотите прочитать файл, то вы должны сделать это на стороне сервера, например, php и предоставьте его как-нибудь dom (есть разные методы), чтобы js мог его использовать. Чтение файла с диска с помощью js невозможно.