关于javascript：没有jQuery的getJSON函数的等价物


Equivalent of getJSON function without jQuery

本问题已经有最佳答案，请猛点这里访问。

没有jQuery，这种方法相当于什么？

1
2
3
4
5
6
7
8
$(function() {
    $.getJSON("datas.json", function(e) {
        var t = [];
        $.each(e, function(e, t) {
            $("div#" + e).text(t)
        })
    })
})

谢谢。

相关讨论

使用普通的JavaScript您的代码看起来像这样：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
function createElements(elements) {
    // Assuming you get an array of objects.
    elements = JSON.parse(elements);

    elements.forEach(funciton (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，然后您的代码将如下所示：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
var request = require('superagent');

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

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

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

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

1
2
3
$(function(){
  ....
});

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

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

这是jQuery的ajax get请求，看看XMLHttpRequest

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

这只是对e中元素的预测。 根据从ajax调用返回的内容，您可能需要for循环或for...in循环。

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

这将设置元素的文本，可能可以用.innerHTML替换。