gpt4 book ai didi

javascript - 从 API 获取 JSON 子集以在 Web 上显示

转载 作者:行者123 更新时间:2023-12-02 14:11:33 25 4
gpt4 key购买 nike

我正在尝试从 API 中抓取一些数据并将数据转换为我自己的网站。

API获取请求: http://api.reliefweb.int/v1/jobs?preset=latest&filter[field]=status&filter

我尝试在我自己的网站上显示该 api 中的所有“标题”。但不知怎的,它不起作用。我确定我已经安装了jquery。代码片段:<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>

但是当我加载 html 文件时没有任何显示。

<!DOCTYPE HTML>

<html>
<head>
<title>Relief Web</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>

<script>

$(document).ready(function() {

$.getJSON('http://api.reliefweb.int/v1/jobs?preset=latest&filter[field]=status&filter', function(reliefResult) {

document.write(reliefResult.title);

});

});
<script>

</head>
<body>
</body>
</html>

最佳答案

您的代码当前将显示未定义,因为titledata数组中对象的属性。您需要循环遍历该数组并创建所需的元素。试试这个:

$.getJSON('https://api.reliefweb.int/v1/jobs?preset=latest&filter[field]=status&filter', function(reliefResult) {
$.each(reliefResult.data, function(_, data) {
$('div').append('<p>' + data.fields.title + '</p>');
})
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div></div>

jQuery 提供了多种添加和修改 DOM 内容的方法,因此您应该避免使用 document.write

关于javascript - 从 API 获取 JSON 子集以在 Web 上显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39511070/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com