解析鼠标悬停菜单效果-优快云博客

本文解析了一段用于实现鼠标悬停显示菜单效果的JavaScript代码。通过分析代码逻辑，介绍了如何利用JavaScript操作DOM元素，实现菜单项切换显示的功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

想做个像网易首页的鼠标滑过显示的菜单，看了网易的代码比较晕。在新浪上看到了一段代码，还比较简单，不过也费了一天多的时间才搞清楚上面的这段JavaScript，由于没有基础，读代码都很辛苦，好悲哀。

function Show_BlkBlackTab(BlkBlackTabid_num,BlkBlackTabnum){

for(var i=0;i<2;i++){document.getElementById("BlkBlackTabcontent_"+BlkBlackTabid_num+i).style.display="none";}

for(var i=0;i<2;i++){document.getElementById("BlkBlackTabmenu_"+BlkBlackTabid_num+i).className="BlkBlackTabOff";}

document.getElementById("BlkBlackTabmenu_"+BlkBlackTabid_num+BlkBlackTabnum).className="BlkBlackTab";

document.getElementById("BlkBlackTabcontent_"+BlkBlackTabid_num+BlkBlackTabnum).style.display="block";

}

第一个for循环是把id为BlkBlackTabcontent_30和BlkBlackTabcontent_31标签里的内容都隐藏，第二个for把id为BlkBlackTabmenu_30和BlkBlackTabmenu_31的类都设置为BlkBlackTabOff，此时就可以把两个菜单的所有内容清空。接下来的语句就是鼠标经过第一个菜单显示第一个，经过第二个显示第二个。我想应该是这样理解。