JavaScript实现左侧菜单效果

本文实例为大家分享了js实现左侧菜单效果展示的具体代码，供大家参考，具体内容如下

当前所学做出来的代码量有点大，以后的学习会使它更简单

 
 
 
 .hide {
  display: none;
 }

 .item .header {
  height: 35px;
  background-color: #2459a2;
  color: white;
  line-height: 35px;
 }
 






 
 菜单1
 
  内容1
  内容1
  内容1
 
 
 
 菜单2
 
  内容2
  内容2
  内容2
 
 
 
 菜单3
 
  内容3
  内容3
  内容3
 
 
 
 菜单4
 
  内容4
  内容4
  内容4
 
 

效果就是这样：

点击任意一个菜单后就会这样：

这样就实现了一个简单的菜单。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持考高分网。