温馨提示：这篇文章已超过239天没有更新，请注意相关的内容是否还可用！
JavaScript二级菜单是一种常见的网页交互效果，它通常用于展示多级分类或者导航菜单。二级菜单的特点是，当鼠标悬停或点击一级菜单时，会显示对应的二级菜单项。
下面是一个简单的JavaScript二级菜单的代码示例：
<!DOCTYPE html>
<html>
<head>
<style>
.menu {
display: none;
}
.menu.active {
display: block;
}
</style>
</head>
<body>
<ul>
<li onmouseover="showMenu(this)" onmouseout="hideMenu(this)">
<a href="#">一级菜单1</a>
<ul class="c775-46dc-ca6e-1ae2 menu">
<li><a href="#">二级菜单1</a></li>
<li><a href="#">二级菜单2</a></li>
<li><a href="#">二级菜单3</a></li>
</ul>
</li>
<li onmouseover="showMenu(this)" onmouseout="hideMenu(this)">
<a href="#">一级菜单2</a>
<ul class="46dc-ca6e-1ae2-a241 menu">
<li><a href="#">二级菜单4</a></li>
<li><a href="#">二级菜单5</a></li>
<li><a href="#">二级菜单6</a></li>
</ul>
</li>
</ul>
<script>
function showMenu(element) {
var menu = element.querySelector('.menu');
menu.classList.add('active');
}
function hideMenu(element) {
var menu = element.querySelector('.menu');
menu.classList.remove('active');
}
</script>
</body>
</html>
在这个示例中，我们使用了HTML和JavaScript来实现二级菜单的效果。我们给一级菜单的`li`元素添加了`onmouseover`和`onmouseout`事件处理函数，分别用于在鼠标悬停和离开时显示或隐藏对应的二级菜单。
在`showMenu`函数中，我们使用`querySelector`方法找到对应的二级菜单元素，并给它添加`active`类名，从而通过CSS的`display`属性来显示菜单。
在`hideMenu`函数中，我们同样使用`querySelector`方法找到二级菜单元素，并移除`active`类名，从而隐藏菜单。
通过这些代码，我们可以实现一个简单的JavaScript二级菜单效果。当鼠标悬停或点击一级菜单时，对应的二级菜单会显示出来。这种交互效果可以增强网页的用户体验，并提供更好的导航功能。
