在html img src代码中调用JavaScript函数(随机img生成器)

Question

我已经搜索了网络和所有旧的Stack Overflow帖子。我一直在尝试一种建议的方法，其中您使用带有空 src=" 地址的 html 标签：

<img id = "imageid" src="">

然后是相应的 Javascript 代码：

function randomImg(){
var randomNumber = Math.floor(Math.random() * 12) + 1;
var imgName = "img_" + randomNumber + ".jpg";
document.getElementById("imageid").src= YOUR_IMG_PATH + "/" + imgName ;
}

因此，我有 12 张图像，全部命名为 img_1.jpg 到 img_12.jpg，是的，我已经检查了它们的导演并通过此功能在我的网站上加载它们，奇怪的是，只有通过使用此代码作为按钮。我只是通过标准html img标签加载图像并不成功：

<button type="button" onclick="randomImg()">Try it</button>

我见过其他建议使用 document.onload = function() 的旧帖子，但这对我不起作用(我还发现了一篇帖子，其中 Stack Overflow 用户表示 document.onload 不会为空src=""标签生成 img src 地址)。我一直尝试以不同的方式格式化事物，即对代码的某些部分使用"而不是"。

我最后的努力是使用数组，但我想看看我是否可以像现在这样解决这个问题，因为我觉得我错过了一些完全基本和明显的东西。

该网站 http://aemaeth0.github.io

Answer 1

好的，谢谢你们，我使用了 G 提供的代码更改@Chris。本质上是他通过函数传递"id"并使用window.onload。这是确切的代码：

<img id="img1" src="">
<script>
function randomImg(id) {
var randomNumber = Math.floor(Math.random() * 12) + 1;
var imgName = "img_" + randomNumber + ".jpg";
document.getElementById(id).src= imgName;
}
window.onload = function() {
randomImg("img1");
}
</script>

我用Java，C++和MATLAB编写过代码，并在Uni学习过数据结构/面向对象编程，但是没有做很多Javascript，并且小的语法原则(例如将id作为函数中的参数传递中的"id")让我失望。

我希望这可以帮助任何试图通过 javascript 在他们的网站上随机生成图像的人，特别是如果他们不想使用数组。

再次感谢所有帮助！