随机图像加载离线工作正常，但不是在网站上

Question

这段代码本身工作得很好，但是一旦我将它嵌入到网站中，它就不再在页面加载时加载图像。 为什么？ 如何改进？

我的猜测是易受影响的windowon.load 。 也许它可以被替代？

 //$(document).ready(function(){choosePic;} //alert(window.onload); //https://stackoverflow.com/questions/2810825/javascript-event-window-onload-not-triggered; window.onload = choosePic; var onloadd = window.onload; var myPix = new Array( "https://m.box.com/file/903146245504/https%3A%2F%2Fapp.box.com%2Fs%2Fj7i88s6jb4yyk4wmiti4tol8ejoikdhl/preview/preview.png", "https://m.box.com/file/1055524661946/https%3A%2F%2Fapp.box.com%2Fs%2Fj7i88s6jb4yyk4wmiti4tol8ejoikdhl/preview/preview.png", "https://m.box.com/file/896387464705/https%3A%2F%2Fapp.box.com%2Fs%2Fj7i88s6jb4yyk4wmiti4tol8ejoikdhl/preview/preview.png" ); function choosePic() { var randomNum = Math.floor(Math.random() * myPix.length); document.getElementById("myPicture").src = myPix[randomNum]; ('#myPicture').html(` ${myPicture} `); ('#today').html(` ${onloadd} `); }

 <button id=onloadd></button> <button id="myrdpbtn" style="background:transparent; border:transparent;" onclick="choosePic()">RandomPicture</button> <button id=onloadd></button><br> <img src="https://ry3yr.github.io/OSTR/release/0mine/documents/art/empty.png" width=1000 id="myPicture"><br><br>

Answer 1

这行得通。

<!----RandomImage--->
<button id="myrdpbtn" style="background:transparent; border:transparent;" onclick="swap()">RandomPicture</button>
<style type="text/css">
#banner {height:100%;object-fit: contain;
//padding:0;margin:0;text-align:right;
//position:relative;
//position:absolute; top: 0px; left: 1200px;
//background-position: center center;
background-size: contain; 
background-repeat: no-repeat;}</style>
<script type="text/javascript"> 
if (document.getElementById) { window.onload = swap };
function swap() {
var numimages=8;
rndimg = new Array(
"https://m.box.com/file/903146245504/https%3A%2F%2Fapp.box.com%2Fs%2Fj7i88s6jb4yyk4wmiti4tol8ejoikdhl/preview/preview.png",
"https://m.box.com/file/905690094898/https%3A%2F%2Fapp.box.com%2Fs%2Fj7i88s6jb4yyk4wmiti4tol8ejoikdhl/preview/preview.png",
"https://cdnb.artstation.com/p/assets/images/images/055/144/127/large/ryedai1-2022-10-19-aoi-realist-no2.jpg?1666212593",
"https://other00.deviantart.net/c476/o/2021/321/8/f/subaru_and_misora_by_pasc91.png",
"https://m.box.com/file/900365515983/https%3A%2F%2Fapp.box.com%2Fs%2Fj7i88s6jb4yyk4wmiti4tol8ejoikdhl/preview/preview.png",
"https://m.box.com/file/889506897379/https%3A%2F%2Fapp.box.com%2Fs%2Fj7i88s6jb4yyk4wmiti4tol8ejoikdhl/preview/preview.png",
"https://m.box.com/file/903146245504/https%3A%2F%2Fapp.box.com%2Fs%2Fj7i88s6jb4yyk4wmiti4tol8ejoikdhl/preview/preview.png",


"https://m.box.com/file/896387464705/https%3A%2F%2Fapp.box.com%2Fs%2Fj7i88s6jb4yyk4wmiti4tol8ejoikdhl/preview/preview.png"
); 
x=(Math.floor(Math.random()*numimages));
randomimage=(rndimg[x]);
document.getElementById("banner").style.backgroundImage = "url("+ randomimage +")"; 
}</script>
</head>
<div id="banner""></div>