<li><a href=”house.html?pId=2&sId=8″>清洁工具</a></li>
<li><a href=”house.html?pId=2&sId=9″>家居清洁</a></li>
</ul>
与一级菜单不同的是，我们将二级菜单中的链接地址加入两个参数值，pId参数指向的是顶部一级菜单的的序号，而sId则是菜单自己的顺序号。我们将这两个菜单的总容器ul都设置了两个不同中的ID，它们需要在JS中调用，所以千万不能少。
样式层
关于样式，其实都没有什么特别的地方，你可以随心所意地设置成你想要的样式，只是需要注意的地方是，我们需要单独设置菜单高亮的三种状态样式，以供JS动态调用。
/*一级菜单的三种样式设置*/
#menu li a.normal{background:#fff;}//普通样式
#menu li a.over{background:#00ff00;} //翻滚样式
#menu li a.cur{background:#ff0000;color:#fff;} //高亮样式
/*二级菜单的三种样式设置*/
#othermenu li a.normal{background:#fff;} //普通样式
#othermenu li a.over{background:#AA7F00;color:#fff;} //翻滚样式
#othermenu li a.cur{background:#7F0000;color:#fff;} //高亮样式
行为层
因为要在行为层中控制菜单的三种状态，所以对于A链接标签，我们就不使用hover伪类来达到菜单的三种动态行为了，我们可以用onmouseover、onmouseout和onclick来模仿伪类的三种行为，这样好便于js的动态调整。并且为了达到行为、样式和结构的三层分离，我们也不用在A标签的html中去加上动态的行为控制代码，这不是一种良好的制作习惯。因此我们需要在页面的加载函数上做点文章，这就需要使用到onload函数，当页面一加载完后就动态绑定a标签的三种行为状态。
在页面一加载完成后，我们首先获取当前的页面url字符串，再根据这个字符串和一二级菜单中的A标签的href地址进行对比，如果存在相同项，则高亮此菜单项的样式。
详细的注释说明我都在下面的函数中一一标注出来，在此就不一一细述了。关键函数代码如下：
//根据URL地址的参数或字符串高亮当前菜单。
function hightLightMenu(firstMenuID,twoMenuID){
var strUrl,strHref,subNavs,strLast,strParentID,strSelfID,
parentID,selfID,strID;
var Navs=document.getElementById(firstMenuID).getElementsByTagName(“a”);
// 如果链接没有参数，或者URL链接中不存在我们要获取的参数，则返回数组中的序号
if(location.href.indexOf(“?”)==-1){
strUrl=location.href.substring(location.href.lastIndexOf(“/”)+1);//取得URL页面名称
//一级菜单高亮
for (var i = 0; i < Navs.length; i++) {
//在IE6,IE7中strHref获得的是全路径，而在IE8和ff中获得的是页面名称，为了兼容，需要将它的字符串进行拆分
