<div class="hf"> <ul class="hf-ul"> <li class="hf-li"><img src="images/1.jpg"></li> <li class="hf-li"><img src="images/2.jpg"></li> <li class="hf-li"><img src="images/4.jpg"></li> </ul> </div> var div1=document.querySelector(".hf") var btn=document.querySelector("button") var lis=document.getElementsByClassName('hf-li') //给按钮绑定点击事件 btn.onclick=function(){ //获取当前div对象的高度 var h1=div1.style.height //判断当前div的高度是否等于260px if(h1=="260px"){ div1.style.height="0px" document.querySelector("#MainMenu").style.margin="0 0 0 0" }else{ div1.style.height="260px" document.querySelector("#MainMenu").style.margin="260px 0 0 0" } } //遍历li对象 for(var i=0;i<lis.length;i++){ //给每个li对象绑定点击事件 lis[i].onclick=function(){ //获取当前li对象中的图片路径 var imgUrl=this.lastElementChild.getAttribute("src") //给body对象设置背景图片 document.body.style="background:url("+imgUrl+") ;background-size: 100% 100%;" document.querySelector("#MainMenu").style.margin="0 0 0 0" //让div对象隐藏 div1.style.height="0px" } }这段代码的意思

这段代码是一段 JavaScript 代码，主要实现以下功能：

1. 当点击按钮时，如果当前 div 的高度为 260px，则将其高度设为 0px，并将 id 为 MainMenu 的元素的 margin 设为 0 0 0 0；否则将其高度设为 260px，并将 id 为 MainMenu 的元素的 margin 设为 260px 0 0 0。

2. 遍历所有 class 为 hf-li 的 li 元素，并给每个 li 元素绑定点击事件。当点击某个 li 元素时，获取该 li 元素下的图片路径，并将 body 元素的背景图片设为该路径所对应的图片，并将 id 为 MainMenu 的元素的 margin 设为 0 0 0 0，同时将 div 元素设为隐藏（高度为 0px）。