Fatal编程技术网

javascript/html：解析JSON响应

javascript html json

javascript/html：解析JSON响应,javascript,html,json,Javascript,Html,Json,我试图通过使用以下查询检索JSON响应，从WikipediaURL中提取摘要部分：。 然后我想解析这个响应并在我的网站的html中显示摘要。 我发现了一个JSON解析的示例，当测试JSON中的字符串时，它似乎可以工作。 我也尝试过重新循环JSON检索函数，但作为一个完全的新手，我显然遗漏了一些东西，因为这个查询的结果没有返回任何数据（下面在html编辑器中使用的结果返回空白页）-有人能建议一个更正，允许我检索wikipedia数据并解析它吗 代码： <html> <body&g

我试图通过使用以下查询检索JSON响应，从WikipediaURL中提取摘要部分：。 然后我想解析这个响应并在我的网站的html中显示摘要。 我发现了一个JSON解析的示例，当测试JSON中的字符串时，它似乎可以工作。 我也尝试过重新循环JSON检索函数，但作为一个完全的新手，我显然遗漏了一些东西，因为这个查询的结果没有返回任何数据（下面在html编辑器中使用的结果返回空白页）-有人能建议一个更正，允许我检索wikipedia数据并解析它吗

代码：

<html>
<body>

<p id="demo"></p>


<script>

var getJSON = function(url, callback) {
    var xhr = new XMLHttpRequest();
    xhr.open('GET', url, true);
    xhr.responseType = 'json';
    xhr.onload = function() {
      var status = xhr.status;
      if (status === 200) {
        callback(null, xhr.response);
      } else {
        callback(status, xhr.response);
      }
    };
    xhr.send();
};

resp=getJSON('https://en.wikipedia.org/w/api.php?format=json&action=query&prop=extracts&exintro&explaintext&redirects=1&titles=Stack%20Overflow')


var obj = JSON.parse(resp);
obj.extract = eval("(" + obj.extract + ")");
document.getElementById("demo").innerHTML =  obj.extract; 
</script>

</body>
</html>




var getJSON=函数（url，回调）{
var xhr=new XMLHttpRequest（）；
xhr.open（'GET'，url，true）；
xhr.responseType='json'；
xhr.onload=函数（）{
var status=xhr.status；
如果（状态===200）{
回调（null，xhr.response）；
}否则{
回调（状态，xhr.response）；
}
};
xhr.send（）；
};
resp=getJSON（'https://en.wikipedia.org/w/api.php?format=json&action=query&prop=extracts&exintro&explaintext&redirects=1&titles=Stack%20Overflow')
var obj=JSON.parse（resp）；
obj.extract=eval（“+obj.extract+”）；
document.getElementById（“demo”）.innerHTML=obj.extract；
**预期JSON响应**预期输出，“提取”后的文本

{“batchcomplete”：“，”查询“：{“pages”：{“21721040”：{“pageid”：21721040，“ns”：0，“title”：“堆栈溢出”，“提取”："Stack Overflow是一个面向专业和热心程序员的问答网站。它是一个私人网站，是Stack Exchange网络的旗舰网站，由Jeff Atwood和Joel Spolsky于2008年创建。它提供了计算机编程中广泛主题的问答。它的创建是为了成为一个更开放的替代方案到早期的问答网站，如专家交流。该网站的名称是在2008年4月由阿特伍德流行的编程博客Codeing Horror的读者投票选择的。该网站是一个供用户提问和回答问题的平台，通过会员资格和积极参与，可以上下投票并以类似于wiki或Reddit的方式编辑问题和答案。Stack Overflow的用户可以获得声誉点数和“徽章”。例如，一个人在回答一个问题时获得“向上”投票，将获得10点声誉点数，“向上”将获得10点声誉点数投票的问题，并可以收到他们的宝贵贡献的徽章，这代表了一个游戏化的传统问答网站。用户解锁新的特权，增加声誉，如投票，评论，甚至编辑别人的文章。所有用户生成的内容是根据知识共享属性ShareAli授权ke许可证。结束提问是与Yahoo！Answers的主要区别，也是防止低质量问题的一种方式。该机制于2013年进行了彻底改革；问题在“暂停”后进行了编辑现在出现在审查队列中。杰夫·阿特伍德（Jeff Atwood）在2010年表示，重复问题不被视为问题，但如果这些额外问题通过增加搜索引擎中相关关键字的点击量来增加网站的流量，则它们将构成一种优势。截至2019年1月，Stack Overflow拥有1000多万注册用户，并且超过2018年年中，共有1600万个问题。根据分配给问题的标签类型，该网站上讨论最多的前八个主题是：JavaScript、Java、C#、PHP、Android、Python、jQuery和HTML。Stack Overflow还有一个工作区，帮助开发人员找到下一个机会。对于雇主来说，Stack Overflow提供了打造品牌的工具他们的业务，在网站上公布他们的空缺职位，并从Stack Overflow的开发人员数据库中寻找候选人，这些开发人员欢迎联系。\n\n“}}

在代码中，
getJSON
接受两个参数：
url
和
callback
。您提供的是第一个参数，而不是第二个参数。您需要做的是在调用
getJSON
之后将代码放入回调函数中，如下所示：

var url = 'https://en.wikipedia.org/w/api.php?format=json&action=query&prop=extracts&exintro&explaintext&redirects=1&titles=Stack%20Overflow';

resp = getJSON(url, afterGet);

function afterGet(error, resp) {
  var obj = JSON.parse(resp);
  obj.extract = eval("(" + obj.extract + ")");
  document.getElementById("demo").innerHTML = obj.extract;
}
这是因为
XMLHttpRequest
是异步执行的。您可以调用它，但在下一行代码运行时无法完成。因此，您可以通过给它一个
回调
函数来告诉它以后运行代码

承诺也是一种将代码执行延迟到异步操作发生之后的好方法。如果您想了解更多关于承诺的信息，可以尝试使用
fetch
而不是
XMLHttpRequest