有没有更简单的方法来加载随机图像？答案

【问题标题】：Is there an easier way to load random images?有没有更简单的方法来加载随机图像？
【发布时间】：2017-10-24 11:32:49
【问题描述】：

我认为我没有正确解释这一点，但我最终回答了我自己的问题，基本上我正在寻找删除头部代码，因为它使文档看起来很难看，并且每次滚动时都非常乏味，我把将 head javascript 代码放入它的文件并从 index head 部分中删除代码，它似乎工作得很好。

感谢大家的帮助！

/关闭 /已回答

谁能指出一种更简单的方法来在我的 index.html 页面上加载随机图像？

这是我目前使用的方法

在头部：

// It currently goes to css/images/images/410.png, I have just put six here so it isn't long and annoying

<script type="text/javascript">
var imageURLs = [
   "css/images/avatars/1.png"
 , "css/images/avatars/2.jpg"
 , "css/images/avatars/3.png"
 , "css/images/avatars/4.png"
 , "css/images/avatars/5.png"
 , "css/images/avatars/6.png"
 ];
 function getImageTag() {
 var img = '<img src=\"';
 var randomIndex = Math.floor(Math.random() * imageURLs.length);
 img += imageURLs[randomIndex];
 img += '\" alt=\"Oh no, the image is broken!\"/>';
 return img;
 }
 </script>

在正文部分：

    <!-- RANDOM IMAGE 1 -->
    <script type="text/javascript">
    document.write(getImageTag());
    </script>
    <!-- RANDOM IMAGE 2 -->
    <script type="text/javascript">
    document.write(getImageTag());
    </script>

我目前共有 410 张图片，因此您可以想象在头部代码中它有多烦人

【问题讨论】：

好吧，如果他们都这样命名，请使用 .. = "css/images/avatars/" + randomIndex + ".png" 而不使用数组。
它们都是css/images/avatars/<number>.png 的形式，其中<number> 是1 到410？
每个 css/images/avatars/ 是一个图像，所以总共（到目前为止）我有 410 行，它继续到 410，我只是在这里放了六个所以不是这样长

标签： javascript html image random

【解决方案1】：

如果你的图片都是这样命名的，这应该可以工作：

<script type="text/javascript">
var imagesCount = 410;
 function getImageTag() {
 var img = '<img src=\"css/images/avatars/';
 var randomIndex = 1+Math.floor(Math.random() * imagesCount );
 img += randomIndex;
 img += '.png\" alt=\"Oh no, the image is broken!\"/>';
 return img;
 }
 </script>

【讨论】：

imageURLs.length 需要替换