Question

我正在尝试在三个div之间切换显示值，但是当我尝试传递变量值以获取div的ID时，一行会出错

document.getElementById(a).style.display = 'none';

HTML

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Chat</title>
    <link rel="stylesheet" href="../CSS/chat.css"/>
  <script>
    var a = "chat";
      function init() {
        document.getElementById('status').style.display = 'none';
        document.getElementById('calls').style.display = 'none';
        console.log("Init complete");
      }

      function action (a) {
        document.getElementById(a).style.display = 'none';
        if (a === "chat") {
          a = "status";
        } else if (a === "status") {
          a = "calls";
        } else {
          a = "chat";
        }
        document.getElementById(a).style.display = 'block';
        document.a = a;
        console.log("Swiped!");
      }
      </script>
  </head>
  <body onload="init()">
<div id="main-grid">
<div id="tabs">
    <ul id="chat">
        <li>Text</li>
        <li>Text</li>
        <li>Text</li>
        <li>Text</li>
        <li>Text</li>
        <li>Text</li>
      </ul>

      <ul id="status">
        <li>Status</li>
        <li>Status</li>
        <li>Status</li>
        <li>Status</li>
        <li>Status</li>
        <li>Status</li>
        </ul>

        <ul id="calls">
          <li>Calls</li>
          <li>Calls</li>
          <li>Calls</li>
          <li>Calls</li>
          <li>Calls</li>
          <li>Calls</li>
          </ul>
  </div>

<div id="button" onclick="action()">
  <svg width="100" height="100">
  <circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" />
</svg>
</div>

</div>
  </body>
</html>

CSS

body {
  width: 90%;
  margin: 0 auto;
  background-color: #fff;
  color: darkgrey;
}
#main-grid  {
  display: grid;
  grid-template-columns: 85% 15%;
  grid-template-rows: auto;
  grid-template-areas: "tabs button";
  width: 80%;
}
#tabs {
  transition: opacity 0.1s;
  grid-area: tabs;

}

#button  {
  grid-area: button;
}

ul {
  list-style: none;
}

是否可以从变量值传递ID？

0 个答案: