javascript上的背景gif更改css

我试图通过用户点击一个div来改变我网站的CSS，当他们这样做时，网站的背景会变成gif，但我不知道如何在JavaScript上做到这一点

这是我的密码

 function easterFun(){
     var changeBG = document.getElementById("body");
     changeEaster.setAttribute("style","background-image:url(eatser.gif)")

而且我的div在被点击时不会做任何事情。它不会执行这个代码。有人能告诉我这个问题吗？？ 欢迎来到假日精神网站

<div  id="easter"onclick="easterFun" style = "cursor: pointer"()>Easter!</div>
<div id = "xmas" onclick ="xmasFun()">Christmas</div>



</body>
</html>

复活节！ 圣诞节 请试试这个

changeEaster.style.backgroundImage = "url(eatser.gif)"; 

---

使用

style.cssText

或

style.backgroundImage

例如：

function easterFun(){
     var changeBG = document.getElementById("body");
     changeBG.style.cssText = "background-image: url(eatser.gif)";
}

或：

注:

document.getElementById

仅捕获ID为的元素（例如

）

对于获取“body元素”，请使用：

document.body

（或

document.getElementsTagName（“body”）[0]

），例如：

---

你很接近。您需要将

getElementById

更改为

getElementsByTagName

并匹配变量：

function easterFun(){
     document.getElementsByTagName("body")[0].setAttribute("style","background-image:url(eatser.gif)");
}

getElementsByTagName

返回一个对象数组，这就是为什么在函数调用之后，我们访问

[0]

---

在上面，为了简洁起见，我还删除了变量声明。

您有一个问题，您的变量与

changeBG

不匹配，

changeest

是否为

eatser.gif

正确的文件名？

function easterFun(){
     var changeBG = document.body;
     changeBG.style.backgroundImage = "url(eatser.gif)";
}

function easterFun(){
     document.getElementsByTagName("body")[0].setAttribute("style","background-image:url(eatser.gif)");
}