目前我有以下 jQuery 代码。
请注意,要在此处运行代码段,您需要先单击并允许:
https://ax.itunes.apple.com/WebObjects/MZStoreServices.woa/ws/RSS/topTvEpisodes/json
(function() {
var iTunesAPI =
"https://ax.itunes.apple.com/WebObjects/MZStoreServices.woa/ws/RSS/topTvEpisodes/json";
$.getJSON(iTunesAPI)
.done(function(data, textStatus) {
$.each(data.feed.entry, function(i, ent) {
$("<li>" + ent.title.label + "</li>").appendTo("#tvshow");
});
console.log("Yippee " + textStatus);
})
.fail(function(jqxhr, textStatus, error) {
var err = textStatus + ", " + error;
console.log("Request Failed: " + err + " " + jqxhr.status);
})
.always(function() {
console.log("Whatever");
})
})();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<ul id="tvshow">
<ul>
这将显示一个电视节目列表,其中电视节目的标题已编号到列表中。我目前正在尝试找到一种使用 jQuery 从 JSON 中提取图像的方法,但我无法这样做。我以为我可以添加
+ ent.title.image
与<li>
成行标签,但这只会返回一个列表,上面写着“未定义”。
任何能为我指明如何提取图像的正确方向的帮助都将不胜感激,我是 jQuery 的新手,所以边学边学。
谢谢, 斯科特
最佳答案
你应该从 JSON 中调用图像
ent["im:image"][0].label
例如:
$("<li><img src='"+ ent["im:image"][0].label +"'/>" + ent.title.label + "</li>").appendTo("#tvshow");
注意:我已将服务调用从 http 更改为 https 以通过 https fiddle 进行演示
(function() {
var iTunesAPI =
"//ax.itunes.apple.com/WebObjects/MZStoreServices.woa/ws/RSS/topTvEpisodes/json";
$.getJSON( iTunesAPI )
.done(function( data, textStatus ) {
$.each( data.feed.entry, function( i, ent ) {
$("<li><img src='"+ ent["im:image"][0].label +"'/>" + ent.title.label + "</li>").appendTo("#tvshow");
});
console.log( "Yippee " + textStatus );
})
.fail(function( jqxhr, textStatus, error ) {
var err = textStatus + ", " + error;
console.log( "Request Failed: " + err + " " + jqxhr.status );
})
.always(function() {
console.log( "Whatever" );
})
})();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="tvshow">
</ul>
关于javascript - 使用 jQuery 显示来自 JSON 的图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46501852/