一个JS+CSS的问题

var li = document.getElementById("active")
li.getElementsByTagName("a")[0].id = li.id;

解决方案 »

  1.   

    #active {
      ...
    }
    改成：
    #active a{
      ...
    }
    就可以实现
    为何楼主要用js
      

  2.   

    不好意思,我把完整的代码都发上来吧,你帮我改一下,我对CSS这些都不是太了解,又要急用,呵呵
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"><html>
            <head>
                    <title>ZDnet Emulation Preview</title>
                    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
                    <style type="text/css">
    <!--
    /* CSS Tabs */
    #navcontainer {
            background: #369;
            border-top: 1px solid #9CC;
            font: normal normal 11px Verdana, Geneva, Arial, Helvetica, sans-serif;
    }#navlist {
            list-style: none outside none;
            margin: 0;
            padding: 0;
    }@media all {
            #navlist {
                    text-align: left
            }
    }#navlist li {
            bottom: 11px;
            display: inline;
            line-height: 1.2em;
            margin: 0;
            padding: 0;
            position: relative;
    }html>body #navlist li {
            background: #000;
            margin: 0 3px 0 0;
            padding: 4px 0px 4px 0;
    }#navlist a, #navlist a:link, #navlist a:visited {
            background: #900;
            border: 1px solid #FFF;
            bottom: 2px;
            color: #FFF;
            cursor: pointer;
            display: inline;
            height: 1em;
            margin: 0;
            padding: 3px 5px 3px 5px;
            position: relative;
            right: 2px;
            text-decoration: none;
    }#navlist a:hover {
            background: #C00;
            bottom: 1px;
            color: #FFF;
            position: relative;
            right: 1px;
    }#navlist a:active {
            background: #999;
            bottom: 0px;
            color: #FFF;
            position: relative;
            right: 0px;
    }#navlist li#active {
            background: #369;
            bottom: 13px;
            display: inline;
            margin: 0 3px 0 0;
            padding: 0;
            position: relative;
    }html>body #navlist li#active {
            background: #000;
            margin: 0 4px 0 4px;
    }#navlist #active a, #navlist #active a:link, #navlist #active a:visited, #navlist #active a:hover {
            background: #369;
            border-bottom: none;
            border-left: 1px solid #9CC;
            border-right: 1px solid #9CC;
            border-top: 1px solid #9CC;
            bottom: 0;
            color: #FFF;
            cursor: text;
            margin: 0;
            padding: 2px 5px 0 5px;
            position: relative;
            right: 0;
    }
    -->
    </style>
            </head>        <body>
                    
    <h4></h4>
    <br /><br />                <div id="navcontainer">
                            <ul id="navlist">
                                    <!-- CSS Tabs -->
        <li id="active"><a id="current" href="mid.html" target ="midframe"> 首 页 </a></li>
        <li><a href="mid.html" target ="midframe"> 统 计 管 理 </a></li>
        <li><a href="mid.html" target ="midframe"> 录 入 管 理 </a></li>
        <li><a href="mid.html" target ="midframe"> 查 询 管 理 </a></li>
        <li><a href="mid.html" target ="midframe"> 网 站 管 理 </a></li>
                            </ul>
                    </div>
            </body>
    </html>
      

  3.   

    css有些乱，但基本没问题，不明白楼主是什么意思，要改成什么样子？
      

  4.   

    比如说点击<网 站 管 理>标签吧,该标签变为<首页>标签的样式,<首页>标签则还原为跟其它标签一样的样式,点击任意标签都得到这样的效果.类似Tabs的样式.不知道我这样说清楚了吗,呵呵,有点弱.
      

  5.   

    最简单应该就是交换<li>的id<li id="active"><a href="mid.html" target ="midframe" onclick="f(this)"> 首   页 </a></li>
    <li><a href="mid.html" target ="midframe" onclick="f(this)"> 统 计 管 理 </a></li>
    <li><a href="mid.html" target ="midframe" onclick="f(this)"> 录 入 管 理 </a></li>
    <li><a href="mid.html" target ="midframe" onclick="f(this)"> 查 询 管 理 </a></li>
    <li><a href="mid.html" target ="midframe" onclick="f(this)"> 网 站 管 理 </a></li>
    <script language=javascript>
    function f(obj){
      var li = document.getElementById("active");
      var objLi = obj.parentNode;
      if(li != objLi){
        li.removeAttribute("id");
        objLi.setAttribute("id","active");
      }
    }
    </script>