我想点class="menu01"的链接,就调用CSS里面的.menu01ch
点class="menu02"的链接,就调用CSS里面的.menu02ch<!DOCTYPE html>
<html>
<SCRIPT type=text/javascript>
//@Mr.Think---函数加载
function addLoadEvent(func) {    var oldonload = window.onload;
    if (typeof window.onload != 'function') {
        window.onload = func;
    } else {
        window.onload = function() {
            oldonload();
            func();
        }
    }
}
//@Mr.Think---判断URL实现菜单高亮显示
function highURL(menuId,classCur){
if(!document.getElementById) return false;
if(!document.getElementById(menuId)) return false;
if(!document.getElementsByTagName) return false;
var menuId=document.getElementById(menuId);
var links=menuId.getElementsByTagName("a");
for(var i=0; i<links.length; i++ ){
var menuLink=links.href;
var currentLink=window.location.href;
if(currentLink.indexOf(menuLink)!=-1){
links.className=classCur; 
}
}
}
//@Mr.Think---点击实现高亮显示
function highOnclick(elemId, tagOff, classCur) {
   
    if (!document.getElementsByTagName) return false;
    if (!document.getElementById) return false;
    if (!document.getElementById(elemId)) return false;
    var elemId = document.getElementById(elemId);
    var links = elemId.getElementsByTagName("a");
    for (i = 0; i < links.length; i++) {
        if (links.parentNode.nodeName !== tagOff) {
            links.onclick = function() {
                for (n = 0; n < links.length; n++) {
                    links[n].className = "";
                }
                this.className = classCur;
                this.blur();
            }
        }
    }
}
//@Mr.Think---追加样式
function addClass(elem, value) {
    if (!elem.className) {
        elem.className = value;
    } else {
        newClass = elem.className;
        newClass += " ";
        newClass += value;
        elem.className = newClass;
    }
}
//@Mr.Think---第一个链接高亮显示
function addTagCur(elemId,tag,classCur){
if (!document.getElementsByTagName) return false;
    if (!document.getElementById) return false;
    if (!document.getElementById(elemId)) return false;
    var elemId = document.getElementById(elemId);
    var tagitem = elemId.getElementsByTagName(tag);
    var links = tagitem[0].getElementsByTagName("a");
    addClass(links[0], classCur);
}
//-----------------------------------------以上为JS类@Mr.Think-----------------------------------------
//top导航高亮function adminfun() {
    highOnclick("side", "ul", "menu01ch");
addTagCur("side","ul","menu01ch")
}
addLoadEvent(adminfun);
</SCRIPT>
<title></title>
<style type="text/css">
<!--
.menu01ch {background-color: #00FF00;}
.menu02ch {background-color: #FFCC00;}
.menu03ch {background-color: #000000;}
.menu04ch {background-color: #00FFFF;}
-->
</style>
</head>
<body>
<div id="side">
<ul>
<a id="menuid"  class="menu01" href="#" >博文列表</a>
<a id="menuid"  class="menu02" href="#">博文回收站</a>
<a id="menuid"  class="menu03" href="#" >博文分类管理</a>
<a id="menuid"  class="menu04" href="#" >博文分类添加</a>
</ul>
</div>
</body>
</html>

解决方案 »

  1.   

    <a id="menuid" class="menu01" href="#" onclick="this.className='menu01ch'">博文列表</a>
    ???
      

  2.   

    <a id="menuid" class="menu01" href="#" onclick="this.className='menu01ch'">博文列表</a>
    <a id="menuid" class="menu02" href="#" onclick="this.className='menu02ch'">博文回收站</a>
    <a id="menuid" class="menu03" href="#" onclick="this.className='menu03ch'">博文分类管理</a>
    <a id="menuid" class="menu04" href="#" onclick="this.className='menu04ch'">博文分类添加</a>
      

  3.   

    注意,不要使用重覆id,id应该是独一无二的<a id="menu01" class="menu01" href="#" onclick="this.className+='ch'">博文列表</a>
    <a id="menu02" class="menu02" href="#" onclick="this.className+='ch'">博文回收站</a>
    <a id="menu03" class="menu03" href="#" onclick="this.className+='ch''">博文分类管理</a>
    <a id="menu04" class="menu04" href="#" onclick="this.className+='ch'">博文分类添加</a>其实用jquery更简单
      

  4.   

    晕,我没说明白,现在的JS是判断当前点击的链接是那个,自动高亮。但JS里面只能调用一种CLASS,但我有一个链接要调用一个不同的CLASS,这个应该在JS里面怎么写?我的想法是,根据ID来读取他的CLASS名字,自动在他后面加上“CH”,我让他每个链接都调用不同的CLASS
      

  5.   


    window.onload = function(){
    var as = document.getElementsByTagName("A");
    for(var i=0;i<as.length;i++){
    as[i].onclick = function(o){
    return function(){
    o.className = o.className + "ch";
    }
    }(as[i])
    }
    }
      

  6.   

    把你的代码加进去后,点击链接,调用了不同的CLASS,但点另外一个链接的时候,别的CSS没还原,而且只能点两次,之后就不变了,好像有错误
    建议把我上面代码,运行下,就能看到效果,只是所有的链接都只调用了一个CLASS
      

  7.   

    css使用有规律的名字就可以实现,比如style1,style2……,当你id为1的按了直接将obj.className="style" + 序号
      

  8.   

    记得同时取消将其他不选中的className=“”