'style' 为空或不是对象

function displaySubMenu(li) {
var subMenu = li.getElementsByTagName("ul")[0];
subMenu.style.display = "block";
}
function hideSubMenu(li) {
var subMenu = li.getElementsByTagName("ul")[0];
subMenu.style.display = "none";
}就这个STYLE还有我的三级菜单在IE6显示不出来，IE7 8 火狐都可以<!--截取了一段-->
<div id="menu">
<li>类
<ul>
   <li onmouseover="displaySubMenu(this)" onmouseout="hideSubMenu(this)" style="display: inline-block;"><a href="productslist.aspID=70.asp">分类1</a>
   <ul>
   <li onmouseover="displaySubMenu(this)" onmouseout="hideSubMenu(this)"><a href="productslistID=69.asp" class="option">三级分类1</a></li>
   <li onmouseover="displaySubMenu(this)" onmouseout="hideSubMenu(this)"><a href="productslist.aspID=70.asp" class="option">三级分类2</a></li>
   </ul>
</ul>
</li>
</div>
#menu{ width:603; float:right; margin-top:-40px;position:relative; padding:0px; font-size: 14px ; background-color:#FFF;}
#menu ul li{ float:left ; position:relative;}
#menu ul ul{display:none; position:absolute;top:36px; left:5px;background:#e7f3f6;width:110px; border:1px solid #DACEDD;filter: Alpha(Opacity=55); border-width:0 1px 1px 1px;}
#menu ul ul ul{display:none; position:absolute;top:0px; left:110px;background:#e7f3f6;width:110px; border:1px solid #DACEDD;filter: Alpha(Opacity=55); border-width:0 1px 1px 1px;}
#menu ul li a{ display:block;padding:0 0 5px; }
#menu ul li a:hover{ background-color:#fff;  }
#menu ul ul li a:hover{ background-color:#291670; color:#FFF}
#menu li ul a{padding:0;width:80px;height:38px; text-align:left; padding-left:30px; color:#666;display:block;}
#menu, #menu li ul {
list-style-type:none;
}

解决方案 »

  1.   

    你三级分类的li没有下级的ul 所谓鼠标移上去报错
      

  2.   

    其实FF下也有错
    只是没弹出来而已
    错在了
    <li onmouseover="displaySubMenu(this)" onmouseout="hideSubMenu(this)"><a href="productslistID=69.asp" class="option">三级分类1</a></li>
       <li onmouseover="displaySubMenu(this)" onmouseout="hideSubMenu(this)"><a href="productslist.aspID=70.asp" class="option">三级分类2</a></li>
    没有子ul
      

  3.   

    function displaySubMenu(li) {
    var subMenu = li.getElementsByTagName("ul")[0];
    subMenu && (subMenu.style.display = "block");
    }
    function hideSubMenu(li) {
    var subMenu = li.getElementsByTagName("ul")[0];
    subMenu && (subMenu.style.display = "none");
    }试试
      

  4.   

    本来我的三级菜单是没有ONMOUSEOVER那些语句的
    UL LI那里我只截取了一段，因为太多了，UL LI这些标签不会少也不会多，因为IE8火狐上是可以显示出三级菜单的
    3L的代码我试用了下，IE6上会报错，IE8不会报错了
    问题是IE6的三级菜单还是不出来
      

  5.   

    IE6也不会报错了，但是IE6三级菜单出不来，这段代码我网上看到的，他那段代码三级菜单可以出来用同一个JS
      

  6.   

    对象的style如果是写在css文件里的，好像是获取不到的，如果写在页面上就可以。我上次获得的时候就出现这个问题，结果把他写到页面里就好了。
      

  7.   

    IE7也不出现3级菜单为什么同一段代码，所有浏览器都可以浏览呢
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>JavaScript下拉菜单</title>
    <style type="text/css">
    * {
    padding:0;
    margin:0;
    }
    body {
    font-family:verdana, sans-serif;
    font-size:small;
    }
    #navigation, #navigation li ul {
    list-style-type:none;
    }
    #navigation {
    margin:20px;
    }
    #navigation li {
    float:left;
    text-align:center;
    position:relative;
    }
    #navigation li a:link, #navigation li a:visited {
    display:block;
    text-decoration:none;
    color:#000;
    width:120px;
    height:40px;
    line-height:40px;
    border:1px solid #fff;
    border-width:1px 1px 0 0;
    background:#c5dbf2;
    padding-left:10px;
    }
    #navigation li a:hover {
    color:#fff;
    background:#2687eb;
    }
    #navigation li ul li a:hover {
    color:#fff;
    background:#6b839c;
    }
    #navigation li ul {
    display:none;
    position:absolute;
    top:40px;
    left:0;
    margin-top:1px;
    width:120px;
    }
    #navigation li ul li ul {
    display:none;
    position:absolute;
    top:0px;
    left:130px;
    margin-top:0;
    margin-left:1px;
    width:120px;
    }
    </style>
    <script type="text/javascript">
    function displaySubMenu(li) {
    var subMenu = li.getElementsByTagName("ul")[0];
    subMenu.style.display = "block";
    }
    function hideSubMenu(li) {
    var subMenu = li.getElementsByTagName("ul")[0];
    subMenu.style.display = "none";
    }
    </script>
    </head>
    <body>
    <ul id="navigation">
    <li onmouseover="displaySubMenu(this)" onmouseout="hideSubMenu(this)">
    <a href="#">栏目1</a>
    <ul>
    <li><a href="#">栏目1->菜单1</a></li>
    <li><a href="#">栏目1->菜单2</a></li>
    <li><a href="#">栏目1->菜单3</a></li>
    <li><a href="#">栏目1->菜单4</a></li>
    </ul>
    </li>
    <li onmouseover="displaySubMenu(this)" onmouseout="hideSubMenu(this)">
    <a href="#">栏目2</a>
    <ul>
    <li><a href="#">栏目2->菜单1</a></li>
    <li><a href="#">栏目2->菜单2</a></li>
    <li><a href="#">栏目2->菜单3</a></li>
    <li><a href="#">栏目2->菜单4</a></li>
    <li><a href="#">栏目2->菜单5</a></li>
    </ul>
    </li>
    <li onmouseover="displaySubMenu(this)" onmouseout="hideSubMenu(this)">
    <a href="#">栏目3</a>
    <ul>
    <li onmouseover="displaySubMenu(this)" onmouseout="hideSubMenu(this)">
    <a href="#">栏目3->菜单1</a>
    <ul>
    <li><a href="#">菜单1->子菜单1</a></li>
    <li><a href="#">菜单1->子菜单2</a></li>
    <li><a href="#">菜单1->子菜单3</a></li>
    <li><a href="#">菜单1->子菜单4</a></li>
    </ul>
    </li>
    <li><a href="#">栏目3->菜单2</a></li>
    <li onmouseover="displaySubMenu(this)" onmouseout="hideSubMenu(this)">
    <a href="#">栏目3->菜单3</a>
    <ul>
    <li><a href="#">菜单3->子菜单1</a></li>
    <li><a href="#">菜单3->子菜单2</a></li>
    <li><a href="#">菜单3->子菜单3</a></li>
    </ul>
    </li>
    </ul>
    </li>
    </ul>
    </body>
    </html>