显示来自返回JavaScript中数组的函数的图像

Question

我有一个函数，可以随机化图像数组，并在显示随机图像后返回带有随机图像的数组。

<script type = "text/javascript">
var images = new Array('0.jpg', '1.jpg' , '2.jpg'), result=[] ;
Array.prototype.random = function () {
    var that = this.slice();
    var length=images.length;
    var rand;
    for(i=0; i<=4;i++)
    {
        rand=Math.floor(Math.random()*(length));
        result.push(images[rand]);
    }
    return result;
} 

//document.write(images.random()); 当我这样做时，我得到了带有图像的数组，但是我想使用诸如document.write('<img src="images/'+images.random()+'" width = \\"\\" height = \\"\\"/>'); \\但是那不起作用..任何想法

Answer 1

每当您执行document.write时， 您的问题都会消除所有DOM。 更好的解决方案是使用document.createElement创建图像，然后将其附加到正文或所需的任何其他容器中。

首先让您的代码清晰明了，创建一个像这样的函数：

function createImage(imgname){
    var img = document.createElement("img");
    img.src = "images/" + imgname;
    return img;
}

然后这样做：

images.random().forEach(function(imgname){
    document.body.appendChild(createImage(imgname));
});

Answer 2

我使用了一些人提供的帮助，这就是我得到的。 因此，此代码获取了一组图像，将它们随机化，然后显示出来

<script type="text/javascript">
var images=new Array('g.jpg','f.jpg','f.jpg')
var re=[];
var length=images.length;
var entered=document.getElementById('images');
for(var f=0; f<4; f++){
var ran=Math.floor(Math.random()*(length));
var imge=document.createElement("img";
image.src="images/" + images[ran];
entered.appendchild(image);
</script)