我是 javascript 的新手。我正在尝试在页面加载时更改图像源。我不知道为什么这不起作用。有人可以给我提供一些见解吗？这是我的 html 代码:
<html>
<body onload="changeImage()">
<ul id="character-list">
<li id="character1">
<img src="character1.jpg" width="250px" height="280px" alt="" />
</li>
</ul>
</body>
<script>
function changeImage(){
var charDiv = document.getElementById("character1");
var imgTag = charDiv.getElementsByTagName('img');
imgTag.src = "character2.jpg";
}
</script>
</html>最佳答案
getElementsByTagName("img")会给你一个 <img> 的数组元素。在这种情况下，您只需访问该数组中唯一的图像元素 charDiv.getElementsByTagName('img')[0] :
<html>
<body onload="changeImage()">
<ul id="character-list">
<li id="character1">
<img src="character1.jpg" width="250px" height="280px" alt="" />
</li>
</ul>
</body>
<script>
function changeImage(){
var charDiv = document.getElementById("character1");
var imgTag = charDiv.getElementsByTagName('img')[0];
imgTag.src = "character2.jpg";
}
</script>
</html>关于Javascript 不会在页面加载时更改图像源，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/33108279/