javascript - 从 Web API 提取并读取 JSON 数据

标签 javascript jquery json

我正在做的是提供 1 行术语的即时定义,也许还有一行回答一些逻辑问题。假设用户输入“JavaScript”,JavaScript 访问 url https://api.duckduckgo.com/?q=JavaScript&format=json&pretty=1 ,获取“Definition”项(请查看 API 链接以了解,Definition 位于第一行本身)并显示其 Definition 值并提醒用户所需的数据。

无论如何,我当前的代码是:

<html>
<head>
<title>Hi</title></head>
<body>
<input id="ddgAPI"><button>Search</button>
<div id="output"></div>
</body>
</html> 

请注意,我没有输入所需的 JavaScript/jQuery 代码,因为我对此感到困惑。谢谢:)

最佳答案

由于这是跨域请求,因此您只能使用代理或 JSONP 来执行此操作。幸运的是DuckDuckGo supports JSONP ,因此您只需确保向 URL 请求添加回调参数,例如:

https://api.duckduckgo.com/?q=JavaScript&format=json&pretty=1&callback=jsonp

...或者使用 jQuery 的 ajax 方法适当的 jsonp 参数,例如:

$('#ddgAPI').on('keyup', function(e) {

  if (e.which === '13') {
    $.ajax({
      type: 'GET',
      url: 'https://api.duckduckgo.com/',
      data: { q: $(this).val(), format: 'json', pretty: 1 },
      jsonpCallback: 'jsonp',
      dataType: 'jsonp'
    }).then(function (data) {
      console.log(data);
    });
  }

});

关于javascript - 从 Web API 提取并读取 JSON 数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18573528/

相关文章:

javascript - 更改 JQuery 就绪调用的顺序

javascript - 无法使用 Angular.js 从表中删除预期的行

javascript - 使用 require.js 进行跨域调用时出现问题?

javascript - 如何从外部解析 JQuery POST 中的 POST 参数和值

php - 将数组从 javascript 发送到 php 无法正常工作

json - TypeScript - 导入 JSON 文件并分配给用接口(interface)声明的变量

javascript - 有没有办法检测可观察对象的嵌套结构的任何元素是否已更改?

jquery - 使用返回的 JSON 填充数据库表

javascript - 如何在 XMLhttp Post 请求中传递多个文件值

javascript - 是否可以在 Javascript 中设置 session cookie,以便只有该浏览器实例可以看到它?