如下是一段简单的左侧菜单html代码
<!DOCTYPE html>
<html lang="en">
<head>
???<meta charset="UTF-8">
<title>Title</title>
<script src="jquery-3.3.1.min.js"></script>
<style>
.hide{display=none} ?????//方法一：通过css隐藏子菜单明细
</head>
<body>
<div class="menu ">
???<div class="enter">
???????<div class="menu_son" onclick="appear(this)">入库扫描</div>
???????<div class="con hide">
???????<div>开始</div>
???????<div>操作</div>
???????<div >结束</div>
???????</div>
???</div>
???<div class="process">
?????<div class="menu_son" onclick="appear(this)">合箱操作</div>
???????<div class="con hide">
???????<div>开始</div>
???????<div>操作</div>
???????<div >结束</div>
???????</div>
???</div>
???<div class="out">
???????<div class="menu_son" onclick="appear(this)">出库扫描</div>
???????<div class="con hide">
???????<div>开始</div>
???????<div>操作</div>
???????<div >结束</div>
???????</div>
???</div>
</div>
<div class="content "></div>
<script>
???$(".menu").css({"height":"700px","width":"300px","background-color":"lightblue","float":"left"})
???$(".content").css({"height":"700px","width":"700px","background-color":"blue","float":"left"})
???$(".hide").css("display","none")//方法二：通过jquery隐藏子菜单明细
???function appear(self) {
???????$(self).next().removeClass("hide");
???}
</script>
</body>
</html>
事实证明方法二不生效，方法一生效。
不得甚解，书之待续。
使用jquery对css格式修改与通过css直接修改的异同
原文地址：https://www.cnblogs.com/rookieboy/p/9684007.html