lovecoding
/
web0331


			
				
					
						
						
							12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849
							<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
      ul {
        display: none;
      }
    </style>
  </head>
  <body>
    <div id="container">
      <h1>管理区</h1>
      <ul>
        <li>你好你好1</li>
        <li>你好你好2</li>
        <li>你好你好3</li>
        <li>你好你好4</li>
      </ul>
      <h1>项目区</h1>
      <ul>
        <li>开心开心1</li>
        <li>开心开心2</li>
        <li>开心开心3</li>
        <li>开心开心4</li>
      </ul>
    </div>
    <!-- 获取所有的h1标签 对h1标签进行点击事件 -->
    <script>
      var container = document.querySelector("#container");
      console.log(container.children);
      var h1 = document.querySelectorAll("h1");
      for (var i = 0; i < h1.length; i++) {
        h1[i].onclick = function () {
          console.log(this);
          var uls = this.nextElementSibling;
          console.log(uls, "uls");
          if (uls.style.display == "none") {
            uls.style.display = "block";
          } else {
            uls.style.display = "none";
          }
        };
      }
    </script>
  </body>
</html>