javascript - 在javascript中显示来自数组的随机图像

Question

我想从 imgArray 中选择随机图像同时打印 16 张不同的图像，但无法填充 imgRandom 函数。

img = new imgArray(7);
img[0]='1.png';
img[1]='2.png';
img[2]='3.png';
img[3]='4.png';
img[4]='5.png';
img[5]='6.png';
img[6]='7.png';
img[7]='8.png';

var rand=imgArray[math.floor(math.random*imgArray.length)];

function imgRandom(){

}

Answer 1

试试这个功能

function getRandomImage(imgAr, path) {
    path = path || 'images/'; // default path here
    var num = Math.floor( Math.random() * imgAr.length );
    var img = imgAr[ num ];
    var imgStr = '<img src="' + path + img + '" alt = "">';
    document.write(imgStr); document.close();
}

调用函数

getRandomImage(ARRAY-VARIABLE, '/images/')

请参阅现场演示。每次刷新都会看到图像的变化

Answer 2

使用以下代码：

var imgArray = ['1.png', '2.png', '3.png', '4.png', '5.png', '6.png', '7.png', '8.png'];
var basePath="YOUR_FOLDER_PATH_HERE";

function imgRandom() {
    for (var i = 0; i < 18; i++) {
        var rand = imgArray[Math.floor(Math.random() * imgArray.length)];
        var image = new Image();
        image.src = basePath+rand;
        document.body.appendChild(image);
    }
}

现场演示| 来源

Answer 3

您的代码中有一些东西我想指出

• imgArray默认情况下，javascript中没有（也许它是你的构造函数）

• 你想要一个Array

• Javascript区分大小写，Mathjs中的对象有大写M

  • math->Math
• 并且对象的random属性Math，必须被调用才能返回一个随机数
  • random->random()
  • Math.random()

但是对你的问题

1. 函数接受参数，因此可以为一组图像接受一个参数

   function (imgArr) {...
   有了这个，您可以访问传递的参数imgArr

2. 函数可以返回值，所以Math.random我们可以继续

   函数 (imgArr) { return imgArr[Math.floor(Math.random() * imgArr.length)] }

3. 您不必“暗淡”阵列，并预定义要放入的元素，您可以做某事。像

   var imgArr = ["img01.png","img02.png",...]
   并且var arr=[]会等于var arr = new Array()

4. 所以用你的数组调用这个函数看起来像

---

  var img = ["1.png", "2.png", "3.png", "4.png", "5.png", "6.png", "7.png", "8.png"]
     function imgRandom(imgArr) {
        return imgArr[Math.floor(Math.random() * imgArr.length)];
    }
 console.log(imgRandom(img));