个回答

• 慕函数2570892

  2019-08-13 17:50:33

  已采纳

  <script type="text/javascript">
  
      // JS实现选项卡切换
      window.onload = function () {
          var nav = document.getElementById("nav");         //获取id为nav的节点，即选项卡的第一行）
          var nav1 = nav.getElementsByTagName("li");        //获取三个选项（房产、家居、二手房）。以数组的形式返回给nav1
          var oDiv = document.getElementById("content");            //获取id为content的节点，该节点包含三页不同的内容。
          var xDiv = oDiv.getElementsByTagName("div");            //进而获得三页的界面，返回形式为数组，用于操作
          for (var i = 0; i < nav1.length;i++){            //该循环将三个选项的属性全部置为
              nav1[i].index = i;
              nav1[i].onmouseover = function () {
                  for (var i=0;i<nav1.length;i++){      //将三个选项的属性class全部置为空，即显示为未被选中效果
                      nav1[i].className = "";
  
                  }
                  this.className = "active";       //鼠标悬停选项的class属性重新被置为active，该选项被显示为选中效果
                  for (var j=0;j<xDiv.length;j++){    //将三个页面的class属性置为hide，即全部隐藏
                      xDiv[j].className = "hide";
                  }
                  xDiv[this.index].className = "show";        //鼠标悬停选项对应的页面的class属性重新被置为show，该界面被显示出来
              }
          }
      }
  
  </script>

  
  

  1

• 慕慕0116261

  2019-08-14 17:57:10

  感谢大佬答复，不过这句

  nav1[i].index = i;

  是什么意思，其他大致都懂的了

  0