<style>
img {
width: 200px;
height: 150px;
margin: 0 10px;
}
body {
background-image: url("img/dog.jpg");
background-size: 100vw 100vh;
}
</style>
<body>
<img src="./img/cat.jpg" alt="" />
<img src="./img/dog.jpg" alt="" />
<img src="./img/sign1.jpg" alt="" />
<script>
let imgs = document.querySelectorAll("img");
let mybody = document.querySelector("body");
for (let i = 0; i < imgs.length; i++) {
imgs[i].onclick = function () {
mybody.style.backgroundImage = `url(${this.src})`;
};
}
// imgs[0].onclick = function(){
// mybody.style.backgroundImage = `url("img/cat.jpg")`
// }
// imgs[1].onclick = function(){
// mybody.style.backgroundImage = `url("img/dog.jpg")`
// }
// imgs[2].onclick = function(){
// mybody.style.backgroundImage = `url("img/sign1.jpg")`
// }
</script>
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
