JQuery:多次插入一个图像

时间:2014-10-14 22:03:20

标签: javascript jquery insert

我不认为这是一个新问题。但对我而言,这是一个新的。

var image = new Image;

image.src = 'https://www.google.ru/images/srpr/logo11w.png';

$('div#imagePlace').append(image);
$('div#imagePlace').append(image);
$('div#imagePlace').append(image);

但只插入一张图片。如何插入所需数量的图像而无需大量下载同一图像。

1 个答案:

答案 0 :(得分:2)

您可以构造一个<img>对象,并在for循环中克隆它并附加到您感兴趣的元素:

$(function() {
    var $img = $('<img />', {
        'src': 'http://placehold.it/100x100'
    });

    for(var i=0; i<5; i++) {
        $img.clone().appendTo('#imagePlace');
    }
});

如果你没有.clone() jQuery对象,你最终会移动它而不是复制它。

请参阅此处的概念验证小提琴:http://jsfiddle.net/teddyrised/Lmvnunq9/