如何将html元素填充到另一个页面中？

这是的script.js 我jQuery的功能，此功能使用来从闪烁的进料和填充结构。如何将html元素填充到另一个页面中？

我想填充HTML结构到另一个名为html页面“items.html”

$function getImages(){ 
    $.getJSON("http://api.flickr.com/services/feeds/[email protected]&lang=en-us&format=json&jsoncallback=?", displayImages); 

    function displayImages(data) {  

// Start putting together the HTML string 
var htmlString = '';   

// Now start cycling through our array of Flickr photo details 
    $.each(data.items, function(i,item){ 
    // Here's where we piece together the HTML 
    htmlString += '<div class="item_wrapper" name="'+item.title+'">'; 
    htmlString += '<img class="item_picture" src="' + item.media.m + '" alt=""/>'; 
    htmlString += '<div class="item_data">'; 
    htmlString += '<div class="item_company">'; 
    htmlString += '<h3 class="fi se en">'+item.title+'</h3>'; 
    htmlString += '</div>'; 
    htmlString += '<div class="item_title">'; 
    htmlString += '<h3 class="fi">'+item.title+'</h3>'; 
    htmlString += '<h3 class="se">'+item.title+'</h3>'; 
    htmlString += '<h3 class="en">'+item.title+'</h3>'; 
    htmlString += '</div>'; 
    htmlString += '</div>'; 
    htmlString += '</div>'; 
}); 
    // Pop our HTML in the DIV tag of items.html 
    // Here's the problem. 
    $('div').html(htmlString); 
    } 
}

所以，我该怎么办呢？谢谢！

来源

2012-12-04 Pakinai Kamolpus

如果您仍然需要使用您的问题，您应该添加更多的信息到您的文章帮助;主要是，你正在努力为你的用户提供哪些功能。你所问的技术问题是好的，但由于你对HTML和jQuery的经验是新手（你的话：P），你很有可能以其他方式达到你想要完成的目标。 – rkw

这里是一个简化版本，没有工作。

getImages(); 
function getImages(){ 
    $.getJSON("http://api.flickr.com/services/feeds/[email protected]&lang=en-us&format=json&jsoncallback=?", 
    function(data) { 
     var htmlString = ''; 
     $.each(data.items, function(key, value){ 
       htmlString += '<div>'+value.title+'</div>'; 
       htmlString += '<img src="'+value.media.m+'">'; 
     }); 
     $('div').html(htmlString); 
    }); 
}

我其实不知道为什么你的版本不起作用。

这可能是可能的，为的getJSON回调需要有一个匿名的没有名字的功能，这就是为什么displayImages功能无法正常工作。我无法让它工作。

你做在你的函数声明前的$。也许这是导致问题的原因。

虽然HTML管柱嵌件作品，像乔希说DOM插入与节点比HTML插入更好。如果你只是寻找一个快速和肮脏的解决方案HTML字符串插入可能会很好。

来源

2012-12-04 10:08:41

您可以使用Ajax加载功能加载在你的网页的HTML内容。

$('div').load("file.html");

来源

2012-12-04 05:42:09 defau1t

您可以另一个HTML页面加载到使用元素：

$('div').load("items.html");

你也不应使用字符串连接来建立你的DOM元素。

使用这样的事情：

var div = $('<div/>'); 

$.each(data.items, function(i, image) { 

    var item = $('<div/>').addClass("item_wrapper").attr('name', image.title); 

    $('<img/>').attr('src', image.media.m).appendTo(item); 

    item.appendTo(div); 

}); 

$('div').html(div);

等等...

来源

2012-12-04 05:49:04 Josh

谢谢先生。但我不明白。我想要做的只是将填充的html元素放入items.html所以稍后会有另一个函数调用items.html，它已经具有从getImages（）函数填充的html结构。 PS：我是HTML和jQuery的新手:) –

如何将html元素填充到另一个页面中？

回答

相关问题