如何用JavaScript编写实现动态二级菜单的代码？

本文共计1223个文字，预计阅读时间需要5分钟。

原文示例：本文实例为大家分享了JavaScript实现二级菜单效果的完整代码，供大家参考。具体内容如下：+ 次级菜单实现效果如下： + 效果图如下：+ 次级菜单实现效果： 当点击某个框架时，会展开已经打开的框架。

改写后：实例代码展示了如何用JavaScript创建二级菜单。具体代码及效果图如下：+ 二级菜单效果： + 效果预览：+ 菜单功能： 点击任一框架，将展开已打开的框架。

本文实例为大家分享了JavaScript实现二级菜单效果的具体代码，供大家参考，具体内容如下

这次实现的效果图如下：

这个二级菜单实现的效果是：

当点击某一个框时，会将已经打开的框的内容收回，再展开现在点击的框的内容。

那要如何实现这个效果呢？

我们可以step by step

1、首先我们要将整个框架显示出来，即所有框展开的样子，因为其显示/不显示是拿overflow:hidden做的。
但是要注意不要所有的框都拿一种类型的盒子做，因为那样不方便写js代码，毕竟我们之后的操作是点击绿色的框=>使得收起或展开白色的框，所以我们需要为每一个天数+对应课程的框放在一个div父盒子下。