Javascript not changing <img> src attribute?
Question
I've been looking through StackOverflow for an hour now and I;m still not sure what I'm missing here. I'm pretty new to JavaScript so it's probably something obvious, but I can't seem to find any answers online.
This is my HTML:
<body id="body" onclick="pageClick()">
<img class="overlay" id="overlay1" src="images/empty.png">
</body>
and this is my JavaScript:
function pageClick() {
document.getElementById("body").style.backgroundColor = "blue";
document.getElementsById("overlay1").src = "images/banned.png";
}
I included the body background color to show myself that the script is running, yet the source attribute is not changing. Any help is appreciated!
3 answers
solution1
1 2018-11-30 20:47:04
是getElementById ，您编写了getElementsById 。
solution2
0 ACCPTED 2018-11-30 20:49:18
使用document.getElementById代替document.getElement 的 ById
solution3
0 2018-11-30 20:49:54
you could use querySelector too
function pageClick() {
document.querySelector("#body").style.backgroundColor = "blue";
document.querySelector(".overlay1").src = "images/banned.png";
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.