求教：我如何在两个标签中间动态添加其他标签？

 是这样的，我有这样 一段代码：
    <div class="menu">
     <ul>
         <li><span class="menuhove" ><a href="index.jsp"  >首 页</a></span></li>
           <li><span><a href="#">栏目一</a></span></li>
           <li><span><a href="lhyy.jsp">栏目二</a></span></li>
                 <li><span><a href="wzlm.jsp">栏目三</a></span></li>
                 <li><span><a href="grtg.jsp">栏目4</a></span></li>
       </ul>
    </div>我想实现的功能是 鼠标在上时 就动态给它添加一个<span class="menuhove" > 标签。
  例如我鼠标在首页上时 它的样式 就是 <li><span class="menuhove" ><a href="index.jsp"  >首 页</a></span></li>
样子。其他的没有。
class="menuhove"  这个样式只有放在 span 标签中有效~~   请教各位大侠了

解决方案 »

  1.   


    <body>
    <style type="text/css">
    .menuhove{ /*这里是你自己的menuhove*/
    background-color:#FFFF00;
    }
    </style>
    <div id="mu" class="menu"> 
    <ul> 
    <li> <span class="menuhove" > <a href="index.jsp"  >首 页 </a> </span> </li> 
    <li> <span> <a href="#">栏目一 </a> </span> </li> 
    <li> <span> <a href="lhyy.jsp">栏目二 </a> </span> </li> 
    <li> <span> <a href="wzlm.jsp">栏目三 </a> </span> </li> 
    <li> <span> <a href="grtg.jsp">栏目4 </a> </span> </li> 
    </ul> 
    </div> 
    <SCRIPT LANGUAGE="JavaScript">
    <!--
    function overMu(id){
    var $=function(o){return document.getElementById(o);},
    gm=$(id).getElementsByTagName("span");
    for(var i=0;i<gm.length;i++){
    gm[i].className="";
    gm[i].onmouseover=function(){
    this.className="menuhove";
    this.onmouseout=function(){
    this.className="";
    }
    };
    }
    }
    overMu("mu"); //在这里传入ID
    //-->
    </SCRIPT>
      

  2.   

    看你的需求，你应该是只要一个鼠标移上去的样式就可以了，完全可以用css来控制.
    <style type="text/css">
    ul li a:hover{    
        background-color:#FFFF00;
    }
    </style>
    加上这行代码试试.