Javascript 这个<；ul>；isn'；不是崩溃，只是扩展_Javascript_Php_Html_Css

Javascript 这个<；ul>；isn'；不是崩溃，只是扩展

javascript php html css

Javascript 这个<；ul>；isn'；不是崩溃，只是扩展,javascript,php,html,css,Javascript,Php,Html,Css,问题是，当我按下Categories时，正在扩展但当我再次按下按钮时，什么也没做在我的CSS文件中是have setdisplay:none 我的php/html页面中有这个 <html> <head> ... <script src="javascript/collapse.js"></script> ... </head> <body>...<ul> <a href="#" onclick=

问题是，当我按下

Categories

时，

正在扩展但当我再次按下按钮时，什么也没做

在我的CSS文件中是have set

display:none
我的php/html页面中有这个
<html>
<head>
...
<script src="javascript/collapse.js"></script>
...
</head>

<body>...<ul>
   <a href="#" onclick="collapse('id1')">Categories</a>
   <ul id="id1">
    <li>
      <a href="#">Business</a>
    </li>
    <li>
      <a href="home.php">Entertainment</a>
    </li>
    <li>
      <a href="home.php">Social Media</a>
    </li>
    <li>
      <a href="home.php">Others</a>
    </li>
  </ul>
</ul>...</html>

我只需要使用html、css和javascript，没有其他框架或库
如果上面问题中的代码粘贴正确，那么问题就出在=
function collapse(id){
    var e = document.getElementById(id);
    if(e.style.display=="block")
        e.style.display="none";
    else
        e.style.display="block";
};

e.style.display=“block”
行指定一个值（=），它没有检查相等性（==）
你不是在比较ifs中的风格。你正在设置它。该表达式的值是您设置的值，即非空字符串，在JavaScript中为真值。因此，始终执行第一个分支
您需要将赋值更改为使用比较运算符（==）进行比较，但在JavaScriot中更好地使用严格版本（==），正如@mpadittech正确指出的那样
您还需要一个else，以便在第一个分支中的值更改后不会执行第二个分支
function collapse(id){
var e = document.getElementById(id);
if(e.style.display==="block")
    e.style.display="none";
else if(e.style.display==="none")
    e.style.display="block";
};

首先，您应该在javascript中使用三重等于进行比较。其次，应该使用else if
语句，否则第二个if
语句将始终否定第一个语句：
if(e.style.display === "block"){
  e.style.display="none";
} else if (e.style.display === "none") {
  e.style.display="block";
}

if(e.style.display === "block"){
  e.style.display="none";
} else if (e.style.display === "none") {
  e.style.display="block";
}