gpt4 book ai didi

javascript - JQuery AJAX 内容不显示

转载 作者:行者123 更新时间:2023-12-03 06:44:16 24 4
gpt4 key购买 nike

我对 JQuery/Ajax 还很陌生;这确实只是我的第二个项目,也是我在这里发表的第一篇文章。我在这里环顾了很多次,只是没有找到答案。下面的语法格式与我在 Wunderground API 中成功使用的格式类似。我认为这将遵循类似的解决方案。这次我正在调用卫报公共(public) API。我可以知道正在返回数据,因为当我将 #newsitem 添加到我的 html 文档中时,我看到我的标签文章、URL 和日期有十次迭代,但我的 DIV 中没有显示任何内容。我在浏览器工具中检查时也可以看到内容。

我确定我错误地搜索了结果数组或者我的语法不正确。我没有发布 HTML,但是,我加载了 JQuery 模块。

感谢任何帮助。抱歉,如果这是转发 - 我已经查看了侧边栏中的每个“类似问题”链接;希望这足够简单。

        $.ajax({
url: 'http://content.guardianapis.com/search?section=us-news&api-key=xxxxx&format=xml',
dataType: 'xml',
success: function(mynews){
$(mynews).find('response results result').each(function() {
var strTitle = $(this).find('web-title').text();
var strUrl = $(this).find('web-url').text();
var strPubdate = $(this).find('web-publication-date').text();

$('#newsitem ul').append(
$('<li />', {
text: 'Article: ' + strTitle
})
);
$('#newsitem ul').append(
$('<li />', {
text: 'URL: ' + strUrl
})
);
$('#newsitem ul').append(
$('<li />', {
text: 'Date: ' + strPubdate
})
);
});

},
error: function() {
$(".newsitem").html('<p>Error: ' + error + '</p>');
}
});

显示页面:

<%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Guardian News</title>
<script src="http://code.jquery.com/jquery-1.8.1.min.js"></script>
<script src="guardiannews.js"></script>
<style type="text/css">
.newsitem li{
font-family: Verdana, sans-serif;
font-size: small;
}
</style>
</head>

<body>
<table width="100%" border="0" cellspacing="0" cellpadding="2">
<tr>
<td>Guardian News</td>
</tr>
<tr>
<td><div id="newsitem"><ul><!-- News Content--></ul></div></td>
</tr>
</table>
</body>
</html>

以下是 API 的一些示例输出。

<response status="ok" user-tier="developer" total="30070" current-page="1" pages="15035" start-index="1" page-size="2" order-by="newest">
<results>
<result web-url="https://www.theguardian.com/us-news/2016/jun/14/orlando-shooting-omar-mateen-motive-pulse-nightclub" type="article" section-id="us-news" web-title="FBI to investigate if Orlando gunman's sexuality was a motive in shooting" api-url="https://content.guardianapis.com/us-news/2016/jun/14/orlando-shooting-omar-mateen-motive-pulse-nightclub" section-name="US news" web-publication-date="2016-06-14T19:23:16Z" id="us-news/2016/jun/14/orlando-shooting-omar-mateen-motive-pulse-nightclub"/>
<result web-url="https://www.theguardian.com/us-news/2016/jun/14/donald-trump-muslim-americans-syrian-refugees-fact-check" type="article" section-id="us-news" web-title="Fact-checking Donald Trump's speech in the wake of the Orlando terror attack" api-url="https://content.guardianapis.com/us-news/2016/jun/14/donald-trump-muslim-americans-syrian-refugees-fact-check" section-name="US news" web-publication-date="2016-06-14T19:19:17Z" id="us-news/2016/jun/14/donald-trump-muslim-americans-syrian-refugees-fact-check"/>
</results>
</response>

最佳答案

查看了API in question ,您后面的值只是元素节点的属性。

您可以使用 attr() 直接访问这些属性,而不是使用 find(),如下所示:

var strTitle = $(this).attr('web-title'),
strUrl = $(this).attr('web-url'),
strPubdate = $(this).attr('web-publication-date');

这是一个fiddle .

关于javascript - JQuery AJAX 内容不显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37819434/

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