Question

我一直在寻找一个接收URL的AJAX函数，然后返回JSON对象。

假设我需要在URL1中显示来自JSON的一些用户信息，并将该显示与来自URL2中的JSON的一些帖子信息混合。

我想在没有JQquery的情况下这样做。

让我们这样说：

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();
}

function getInfo(){
var users, posts;
loadJSON('http://.com/users',
         function(dataU) {
            users = dataU;
         },
         function(xhr) { console.error(xhr); }
);
loadJSON('http://.com/posts',
         function(dataP) {
            posts = dataP;
         },
         function(xhr) { console.error(xhr); }
);

console.log(users);
console.log(posts);

}

getInfo();

Answer 1

要在没有jQuery的情况下实现这一点，您可以回归到纯JavaScript XMLHttpRequest。这将允许您与远程主机建立HTTP连接，例如GET数据。

要开始使用这些请求，您可以查看MDN's getting started guide。

JSON.parse() function将帮助您将JSON字符串转换为JavaScript对象。

作为XMLHttpRequest的替代方案，您还可以查看fetch API。它为HTTP调用提供了更清晰的界面。但由于它仍然是实验性的，您可能需要使用polyfill。

Answer 2

有或没有jQuery XMLHttpRequest objest 是异步的。 jQuery在内部使用它。 FIY AJAX代表 A 同步 J avascript A nd X ml。这意味着您无法从异步函数接收同步结果。但您可以而且应该在发送给请求的回调函数中使用结果因此正确的用法是从console.log或success回调中调用error（或任何您想要的内容）。
已知解决方案degrade gracefully何时XMLHttpRequest不可用。在这些解决方案中，创建并附加script或iframe，然后从他们的.onload处理程序中读取。所有这些都是异步，之前的所有注意事项都直接适用于它们您无法从异步功能接收同步结果我对所有的挫折都持有这个真理。

从不同的URL检索JSON对象的Javascript（无JQuery）函数？

2 个答案: