javascript - 随机加载不在同一目录中的图像

Question

我希望每次重新加载页面时随机加载图像。但是要使用的代码不能只从某个目录中选择一张照片，而是需要每次随机选择一个预设路径到不同目录中的不同照片。

预设路径是这些:

https://static.webshopapp.com/shops/054833/files/097622657/eddy-hilhorst-fotel-photography-courses-tours.jpg

https://static.webshopapp.com/shops/054833/files/097622663/hiromi-fujii-fotel-photography-courses-tours.jpg

https://static.webshopapp.com/shops/054833/files/097622666/jungsoon-suh-fotel-photography-courses-tours.jpg

下面是一些代码。应该取出下面代码中已经可见的照片。把它放在那里，这样现在就可以看到一些东西。

#myContainer {
    position: absolute;
    height: 150px;
    width: 150px;
    background-color: #ffffff;
    margin-top: 30px;
    border-radius: 75px;
    overflow: hidden;
    border-style: solid;
    border-width: 8px;
    border-color: #ffffff;
    padding: 8px;
}

#myPhoto {
    width: 150px;
    height: auto;
    margin-top: -8px
}

<div id="myContainer">
    <img id="myPhoto" src=" https://static.webshopapp.com/shops/054833/files/097160429/eddyhilhorst-fotelphotographycoursesandtours-no-lo.jpg" />
</div>

Answer 1

var images = [
	'https://static.webshopapp.com/shops/054833/files/097622657/eddy-hilhorst-fotel-photography-courses-tours.jpg',
        'https://static.webshopapp.com/shops/054833/files/097622663/hiromi-fujii-fotel-photography-courses-tours.jpg',
        'https://static.webshopapp.com/shops/054833/files/097622666/jungsoon-suh-fotel-photography-courses-tours.jpg'
];



var rand = images[Math.floor(Math.random() * images.length)];

document.querySelector('#myPhoto').src = rand;

<div id="myContainer">
    <img id="myPhoto" src=" https://static.webshopapp.com/shops/054833/files/097160429/eddyhilhorst-fotelphotographycoursesandtours-no-lo.jpg" />
</div>

现在您可能会连续多次看到同一张图片，因为这是随机的一部分。不过，如果有更多图片，问题就不大了。