利用js如何实现菜单的收缩或者展开

1、先布局菜单，示例html代码如下所示：

2、该html代码运行后的页面效果图如下：

3、加上css样式，使默认情况下菜单是收缩的。

4、再次运行，能够发现每个城市下面的区都隐藏起来了，菜单处于收缩状态。

5、点击城市，当菜单展开时则收缩，当菜单收缩时则展开。

6、利用js和css实现的菜单效果还有很多，如下图：