没有jQuery的getJSON函数的等价物[重复]答案

【问题标题】：Equivalent of getJSON function without jQuery [duplicate]没有jQuery的getJSON函数的等价物[重复]
【发布时间】：2015-05-06 22:20:57
【问题描述】：

如果没有 jQuery，这种方法的等价物是什么？

$(function() {
    $.getJSON("datas.json", function(e) {
        var t = [];
        $.each(e, function(e, t) {
            $("div#" + e).text(t)
        })
    })
})

谢谢。

【问题讨论】：

你的意思是没有 jquery 吗？因为它已经是纯JS了。
你做了哪些努力？
查看此站点：youmightnotneedjquery.com/#json 获取 JSON AJAX 请求。使用简单的 for 循环或 forEach 而不是 $.each。
这太宽泛了，代码做了很多不同的事情。你有什么具体问题？发出 HTTP 请求？解析JSON？循环对象？
@poipoi jQuery 是纯 JS。它只是一个js函数库。

标签： javascript getjson

【解决方案1】：

您发布的代码有几个部分。

$(function(){
  ....
});

这相当于 jQuery 的 window.onload = function(){..}

$.getJSON("datas.json", function(e) {
   ..
});

这是 jQuery 的 ajax 获取请求，这个看XMLHttpRequest

$.each(e, function(e, t) {
   ..
});

这只是对e 中的元素进行foreach。根据您的 ajax 调用返回的内容，您可能需要一个 for 循环或 for...in 循环。

$("div#" + e).text(t)

这设置了一个元素的文本，可能可以替换为.innerHTML。

【讨论】：

【解决方案2】：

使用纯 Javascript，您的代码将如下所示：

function createElements(elements) {
    // Assuming you get an array of objects.
    elements = JSON.parse(elements);

    elements.forEach(function (element) {
        var div = document.getElementById(element.id);
        div.innerHTML = element.text;
    });
}

var request = new XMLHttpRequest();

request.onload = createElements;
request.open("get", "datas.json", true);
request.send();

或者您可以使用其他很酷的库，例如 superagent，然后您的代码将如下所示：

var request = require('superagent');

function createElements(elements) {
    // Assuming you get an array of objects.
    elements = JSON.parse(elements);

    elements.forEach(function (element) {
        var div = document.getElementById(element.id);
        div.innerHTML = element.text;
    });
}

request.get('datas.json').end(function(error, elements){
    if (!error) {
        createElements(elements);
    }
});

【讨论】：