如何动态附加 div 和图像？

Question

我想问有没有一种方法可以使用 javascript 在其中添加一个 div 和一个图像？

所以基本上，图像存储在一个数组中。 displayAllImages function() 将图像附加到 div #images 但我希望该函数应该附加一个 div 并且在新的 div 中应该有图片可以是背景或包含在div中的图片。这应该对所有图像重复，因为 3 个图像应该显示为 3 个 div，其中包含 3 个不同的图像/数组元素。尝试仅坚持数组实现。谢谢！

Jsfiddle : http://jsfiddle.net/1qk3voxq/

    var gallery= new Array();

    gallery[0]="http://s6.tinypic.com/1zd1a47_th.jpg";
    gallery[1]="http://s6.tinypic.com/2ngh9ty_th.jpg";
    gallery[2]="http://s6.tinypic.com/29zy5qf_th.jpg";

    var x= $("#images");

    function displayAllImages() {
        var i = 0,
            len = gallery.length;        
        for (; i < gallery.length; i++) {
            		
           x.append("<img class='roll' src='" + gallery[i] + "'>");
        } 
    };
    	
    $(function() {
        displayAllImages();
    });

    #container {
     width:600px;
     height:600px;
     background-color:#000;
     }

    .roll {
        margin:4px;
      }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="container">
    <div id=images></div>
    </div>

Answer 1

你的意思是这样吗？

x.append("<div class='roll'><img  src='" + gallery[i] + "'></div>");

Updated Fiddle