js实现鼠标移到导航改变li标签的CSS样式解决方法

js实现鼠标移到导航改变li标签的CSS样式
js：

JScript code

 <script language="javascript">        var ul = document.getElementById("ul");  var lis = ul.getElementsByTagName("li");for ( var i=0,len=lis.length; i <len; i++) { (function(){     lis[i].onmouseover = function(){this.className ="on";};        lis[i].onmouseout = function(){this.className="";};  })(i);}</script> 

html：

HTML code

<div id="main-menu">                    <ul class="nav">                        <li id="li-index" ><a href="index.html">首页</a></li>                        <li id="li-info"><a href="#">城市情报</a></li>                        <li id="li-map" ><a href="#">情绪地图</a></li>                        <li id="li-shortcut" ><a href="#">休闲快捷</a></li>                        <li id="li-vogue" ><a href="#">时尚中人</a></li>                        <li id="li-other" ><a href="#">其他栏目</a></li>                    </ul>                    <!-- End subnav -->                </div>

实现将鼠标移动到导航上 改变所处标签的CSS样式。 写了上面的js代码 就是实现不了。求解决

[解决办法]
var lis = ul.getElementsByTagName("li");
改成 var lis = document.getElementsByTagName("li");
[解决办法]

探讨

var ul = document.getElementById("ul");这个写错了。。这个是找Id 为ul的ul。。

[解决办法]
var ul = document.getElementById("ul");

其中id "ul" 未定义

查看更多 下一篇