js实现超简单的展开、折叠目录代码

JavaScript实现超简单目录展开与折叠功能

今天我来分享一个使用JavaScript实现的超简单目录展开和折叠的代码。这个菜单功能类似于树形菜单，只需通过鼠标点击即可轻松展开或折叠目录。

运行效果展示：

具体实现方式：

HTML部分，我们创建了两个主要的目录“主目录1”和“主目录2”，以及对应的子目录。每个主目录都有一个点击事件，用于控制其子目录的显示与隐藏。

CSS部分，我们为主目录和子目录设置了基本的样式，如字体大小、颜色、背景色等。

JavaScript部分，通过onclick事件来控制子目录的显示与隐藏。当点击主目录时，会触发一个函数，该函数检查子目录的当前显示状态，并据此决定是显示还是隐藏子目录。

代码示例：

```html

```

这个例子中的代码非常简洁实用，无需复杂的JavaScript框架或库，适合初学者了解和学习基本的JavaScript交互功能。希望这个例子能够帮助大家更好地理解如何使用JavaScript实现简单的目录展开和折叠功能。