Javascript 如何插入<;img>;内部<;a>;用jQuery?
我正在玩一些JSON数据。使用下面的JavaScript,我可以检索一些链接Javascript 如何插入<;img>;内部<;a>;用jQuery?,javascript,jquery,html,json,Javascript,Jquery,Html,Json,我正在玩一些JSON数据。使用下面的JavaScript,我可以检索一些链接 (函数(){ var flickrAPI=”https://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?"; $.getJSON(flickrAPI{ id:“132455232@N07", 朗:“恩,我们”, 格式:“json” }) .完成(功能(数据){ $.each(data.items,function(i,item){ log
(函数(){
var flickrAPI=”https://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";
$.getJSON(flickrAPI{
id:“132455232@N07",
朗:“恩,我们”,
格式:“json”
})
.完成(功能(数据){
$.each(data.items,function(i,item){
log(data.items[i]['link']);
如果(i==5){
返回false;
}
});
});
})();代码>
以下是一种方法:
(function() {
var flickrAPI = "https://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";
$.getJSON( flickrAPI, {
id: "132455232@N07",
lang: "en-us",
format: "json"
})
.done(function( data ) {
$.each( data.items, function( i, item ) {
var html = '<a href="'+ item.media.m +'"><img src="'+ item.media.m +'"/></a>';
$(html).appendTo( "#images" );
if ( i === 5 ) {
return false;
}
});
});
})();
(函数(){
var flickrAPI=”https://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";
$.getJSON(flickrAPI{
id:“132455232@N07",
朗:“恩,我们”,
格式:“json”
})
.完成(功能(数据){
$.each(data.items,function(i,item){
var html='';
$(html)。附加到(“#图像”);
如果(i==5){
返回false;
}
});
});
})();
您只需将HTML形成一个字符串,并将其传递给jQuery 这里有一种方法:
(function() {
var flickrAPI = "https://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";
$.getJSON( flickrAPI, {
id: "132455232@N07",
lang: "en-us",
format: "json"
})
.done(function( data ) {
$.each( data.items, function( i, item ) {
var html = '<a href="'+ item.media.m +'"><img src="'+ item.media.m +'"/></a>';
$(html).appendTo( "#images" );
if ( i === 5 ) {
return false;
}
});
});
})();
$.each( data.items, function( i, item ) {
var img = $( "<img>" ).attr( "src", item.media.m );
var a= $( "<a>" ).attr( "href", item.media.m );
img.appendTo(a);
a.appendTo( "#images" );
if ( i === 5 ) {
return false;
}
});
(函数(){
var flickrAPI=”https://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";
$.getJSON(flickrAPI{
id:“132455232@N07",
朗:“恩,我们”,
格式:“json”
})
.完成(功能(数据){
$.each(data.items,function(i,item){
var html='';
$(html)。附加到(“#图像”);
如果(i==5){
返回false;
}
});
});
})();
您只需将HTML形成一个字符串,并将其传递给jQuery $。每个(数据项、函数(i、项){
$.each( data.items, function( i, item ) {
var img = $( "<img>" ).attr( "src", item.media.m );
var a= $( "<a>" ).attr( "href", item.media.m );
img.appendTo(a);
a.appendTo( "#images" );
if ( i === 5 ) {
return false;
}
});
var img=$(“”).attr(“href”,item.media.m);
(a)的附件;
a、 附于(“#图像”);
如果(i==5){
返回false;
}
});
在href的结果中查找正确的值。$。每个(data.items,function(i,item){
var img=$(“”).attr(“href”,item.media.m);
(a)的附件;
a、 附于(“#图像”);
如果(i==5){
返回false;
}
});
在href的result中查找正确的值。签出wrap
函数(),该函数完全按照其名称执行。它用任何html包装元素
检查您编辑的代码,我创建了一个名为link的新变量(创建图像的方式与创建图像的方式相同),在将图像附加到#images
后,我调用wrap(link)
我认为这不是一个坚如磐石的解决方案,因为性能下降了。
您可以(也应该)创建一个带有字符串的数组,并将其一次性写入DOM
(函数(){
var flickrAPI=”https://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";
$.getJSON(flickrAPI{
id:“132455232@N07",
朗:“恩,我们”,
格式:“json”
})
.完成(功能(数据){
$.each(data.items,function(i,item){
var image=$(“”).attr(“href”,“//example.org”);
image.appendTo(“#images”).wrap(链接);
如果(i==5){
返回false;
}
});
});
})();代码>
img{
高度:159px;
浮动:左;
利润率:10px;
}
签出wrap
函数(),该函数完全按照其名称执行。它用任何html包装元素
检查您编辑的代码,我创建了一个名为link的新变量(创建图像的方式与创建图像的方式相同),在将图像附加到#images
后,我调用wrap(link)
我认为这不是一个坚如磐石的解决方案,因为性能下降了。
您可以(也应该)创建一个带有字符串的数组,并将其一次性写入DOM
(函数(){
var flickrAPI=”https://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";
$.getJSON(flickrAPI{
id:“132455232@N07",
朗:“恩,我们”,
格式:“json”
})
.完成(功能(数据){
$.each(data.items,function(i,item){
var image=$(“”).attr(“href”,“//example.org”);
image.appendTo(“#images”).wrap(链接);
如果(i==5){
返回false;
}
});
});
})();代码>
img{
高度:159px;
浮动:左;
利润率:10px;
}
您能使用.append()吗
.done(函数(数据){
$.each(data.items,function(i,item){
$(“#图像”)。附加(“”;
如果(i==5){
返回false;
}
});
});
您能使用.append()吗
.done(函数(数据){
$.each(data.items,function(i,item){
$(“#图像”)。附加(“”;
如果(i==5){
返回false;
}
});
});
答案很好,但解释很有用everGood答案很好,但解释很有用everGood答案和解释。:)答案和解释很好。:)