如何用JS控制当前正在浏览的页面的链接样式～～在线等

在链接的onclick事件里写了this.className='on'
我的意思是假如我点击了‘mainA’这个链接后。其他两个的className=''

解决方案 »

  1.   

    <style type="text/css">
    a.on:link,a.on:visited{margin-top:2px;line-height:20px;color:#7F6D46;font-size:14px;text-decoration:none;font-size:14px;}
    .aa{}
    </style>
    <a class="on" href="#" onclick="this.className='aa'">aaa</a>
      

  2.   

    <style type="text/css">
    a.on:link,a.on:visited{margin-top:2px;line-height:20px;color:#7F6D46;font-size:14px;text-decoration:none;font-size:14px;}
    </style>
    <a  href="#" onclick="this.className='on'">aaa</a>
    <a  href="#"  >vvvvvvv</a>
    <a  href="#" >vccccccc</a>
      

  3.   

    my_web不太清楚你要表达的意思。
      

  4.   

    看看吧<!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>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    <style>
    a{color:#f60;}
    a.on:link,a.on:visited{margin-top:2px;line-height:20px;color:#7F6D46;font-size:14px;text-decoration:none;font-size:14px} </style>
    <script>
    function $(objID){ 
     return "string" == typeof(objID) ? document.getElementById(objID) : objID;
     }
    function addEvt(){
     var ctab = $("menu_list").getElementsByTagName("a");
     for(var i = 0;i<ctab.length;i++)
     { 
      ctab[i].onclick =function std(){
    for(var i = 0;i<ctab.length;i++){
    if(i!=parseInt(this.rel-1))
    {
    ctab[i].className="";
    }
    }
    ctab[parseInt(this.rel)-1].className="on";
      }
     }
    }
    window.onload=addEvt;
    </script>
    </head><body>
    <div id="menu_list"><a href= '# ' id= 'mainA ' rel="1" class="on"> 主页 </a> <a href= '# ' id= 'articleA ' rel="2"> 文章 </a> <a href= '# ' id= 'albumA ' rel="3"> 相册 </a></div></body>
    </html>你可以参考 http://www.ok22.org/art_detail.aspx?id=64 
    更多TAB切换效果
      

  5.   

    <!doctype html public "-//w3c//dtd html 4.0 transitional//en">
    <html>
     <head>
      <title> new document </title>
      <meta http-equiv="Content-Type" content="text/html; charset=gbk"/>
      <meta name="generator" content="editplus">
      <meta name="author" content="">
      <meta name="keywords" content="">
      <meta name="description" content="">
      <style type="text/css">
    a.on:link,a.on:visited{margin-top:2px;line-height:20px;color:#7F6D46;font-size:14px;text-decoration:none;font-size:14px} 
      </style>
      
      <script type="text/javascript">
       function change(obj){
       document.getElementById("mainA").className="";
       document.getElementById("articleA").className="";
       document.getElementById("albumA").className="";
      
       obj.className="on";
       }
       </script>
     </head> <body>
    <a   href= '#'   id= 'mainA' onclick="change(this)"> 主页 </a> 
    <a   href= '#'   id= 'articleA' onclick="change(this)"> 文章 </a> 
    <a   href= '#'   id= 'albumA' onclick="change(this)"> 相册 </a>
     </body>
    </html>