省略号代表循环添加的部分,index1...indexn...  
<script type="text/javascript">
thisURL = (document.URL).toLowerCase( );
if (thisURL.indexOf("index1")>0){
document.getElementById("index1").className="now";
document.getElementById("index2").className="";
document.getElementById("index3").className="";
document.getElementById("index4").className="";
document.getElementById("index5").className="";
document.getElementById("index6").className="";
document.getElementById("index7").className="";
document.getElementById("index8").className="";
...
}if (thisURL.indexOf("index2")>0){
document.getElementById("index1").className="";
document.getElementById("index2").className="now";
document.getElementById("index3").className="";
document.getElementById("index4").className="";
document.getElementById("index5").className="";
document.getElementById("index6").className="";
document.getElementById("index7").className="";
document.getElementById("index8").className="";
....
}
.
.
.
.
.
</script>

解决方案 »

  1.   


    <script type="text/javascript">
    thisURL = (document.URL).toLowerCase( );
    for(var i=1;i<n;i++){
    var index="index"+i;
    if (thisURL.indexOf(index)>0){
    document.getElementById(index).className="now";
    }else{
    document.getElementById(index).className="";
    }
    }
    </script>
      

  2.   

    thisURL = (document.URL).toLowerCase( );
    for(var i=1;i<=n;i++){
    if (thisURL.indexOf("i")>0){
    for (var j=1;j<=n;j++){
    document.getElementById("index"+j).className="";
    }
    document.getElementById("index"+i).className="now";
    }
    }
      

  3.   

    len = 8,根据实际情况确定thisURL = (document.URL).toLowerCase();
    for(var i=0 ,len = 8 ;i<len;i++)
    {
      document.getElementById("index"+i).className=(thisURL.indexOf("index"+i)!=-1?"now":"");
    }
      

  4.   

    thisURL = (document.URL).toLowerCase( );
    iArr=1;
    for(i=0;i<10;i++){
      if(thisURL.indexOf("index"+i)>0){
        while (document.getElementById("index"+iArr)){
           document.getElementById("index"+iArr).className="";
           iArr++;
        }
        document.getElementById("index"+i).className="now";
        break;
      }
    }
      

  5.   

    thisURL = (document.URL).toLowerCase( );
    iArr=1;
    for(i=0;i<10;i++){
      if(thisURL.indexOf("index"+i)>0){
      while (document.getElementById("index"+iArr)){
      document.getElementById("index"+iArr).className="";
      iArr++;
      }
      document.getElementById("index"+i).className="now";
      break;
      }
    }
      

  6.   


    <script type="text/javascript">
      thisURL = (document.URL).toLowerCase( );
      for(var i=1;i<n;i++){
        document.getElementById('index'+i).className=thisURL.indexOf('index'+i)>0 ? 'now' : '';
      }
    }
    </script>
      

  7.   

    <script type="text/javascript"> thisURL = (document.URL).toLowerCase( ); for(var i=1;i<n;i++){ var index="index"+i; if (thisURL.indexOf(index)>0){ document.getElementById(index).className="now"; }else{ document.getElementById(index).className=""; } } </script>
      

  8.   


     for(var i=0 ,len = 8 ;i<len;i++){
                 document.getElementById("index"+i).className ='';
            }
            var index  = (document.URL).toLowerCase( ).match(/index\d+/g);
            document.getElementById(index).className='now';
      

  9.   

    一楼NOW的样式好像循环不下去,指挥停留在INDEX1那里
      

  10.   

    都试了下,都是NOW循环不下去,只会停留在第一个值
      

  11.   

    不对,都不会读取到NOW,我把NOW的结构打出来下<a id="index1" class="now"  href="about.asp">1</a>
    <a id="index2"  href="about.asp">1</a>
    <a id="index3"  href="about.asp">1</a>
    .
    .
    .
    .
      

  12.   

    问题不在循环本身,可能在thisURL = (document.URL).toLowerCase( );这里。
    你把thisURL贴出来,或者用thisURL=location.href.toLowerCase( );试试
      

  13.   

    这怎么可以呢?你的href里根本不存在INDEX1这样的参数,呵呵。<a id="index1" class="now" href="about.asp?id=index1">1</a>
    <a id="index2" href="about.asp?id=index2">1</a>
    <a id="index3" href="about.asp?id=index3">1</a>about.asp:<script type="text/javascript">
    window.onload=function(){
      var s=location.search.toLowerCase();
      for(var i=1;i<n;i++){
        document.getElementById('index'+i).className=s=='index'+i ? 'now' : '';
      }
    }
    </script>
      

  14.   

    哦,13楼好像理解的不对!你还是把你的document.URL.toLowerCase();贴出来就知道怎么回事了
      

  15.   

    <html>
    <head>
      <title></title>
       <script language="javascript" type="text/javascript">
            function test(){
                for(var i=1 ,len = 3 ;i<len;i++){
                document.getElementById("index"+i).className ='';
                }
                //var index  = (document.URL).toLowerCase( ).match(/index\d+/g);
                var index  = "http://bbs.csdn.net/index3".toLowerCase().match(/index\d+/g);
                //alert(index);
                document.getElementById(index).className='now';
            }
        </script>
    <style>
    .now{color:Red;}
    </style>
    </head>
    <body>
    <a id="index1" class="now" href="about.asp">1</a>
    <a id="index2" href="about.asp">1</a>
    <a id="index3" href="about.asp">1</a>
    <input type="button" value="test" onclick="test();" />
    </body>
    </html>就是这作用吧 。var i=1  。
      

  16.   

    不是,不是读后缀的,每个页面的命名都不一样,有ABOUT.ASP  也有 HR.ASP。。
      

  17.   

    我整理一下,之前我是这样的JS
    <script type="text/javascript">
    thisURL = (document.URL).toLowerCase( );
    if (thisURL.indexOf("index1")>0){
    document.getElementById("index1").className="now";
    document.getElementById("index2").className="";
    document.getElementById("index3").className="";
    document.getElementById("index4").className="";
    document.getElementById("index5").className="";
    document.getElementById("index6").className="";
    document.getElementById("index7").className="";
    document.getElementById("index8").className="";
    ...
    }if (thisURL.indexOf("index2")>0){
    document.getElementById("index1").className="";
    document.getElementById("index2").className="now";
    document.getElementById("index3").className="";
    document.getElementById("index4").className="";
    document.getElementById("index5").className="";
    document.getElementById("index6").className="";
    document.getElementById("index7").className="";
    document.getElementById("index8").className="";
    }
    .
    .
    .
    .
    .
    </script>
    页面的连接是这样的
    <a id="index1" class="now" href="a.asp">1</a>
    <a id="index2" href="b.asp">2</a>
    <a id="index3" href="c.asp">3</a>
    之前我没写循环的时候,就可以点那个连接,就激活NOW的样式,其他没就没有NOW
      

  18.   

    不管什么内容是动态获取的啊,我的那段代码主要判断ID的
    我本地测试的http://localhost/rlzc
      

  19.   

    我猜问题就出在这里!!
    你顶楼给出了判断条件是:
    thisURL = (document.URL).toLowerCase( );
    [color=#FF0000]if (thisURL.indexOf("index1")>0){[/color]
    这样就告诉别人,你的页面的location里会含有index1之类的参数或字符。
    所以大家才踊跃的发言献策。结果你的document.URL和你的判断条件完全没有关系!呵呵你把你想实现的需求简单的再说说吧。前面给的完全不对
      

  20.   

    额大家都误会了吗?对不起啊,那我在总结一次首先呢,我是要通过JS,判断连接里面的ID指,来激活CSS“NOW”这个样式所以我写了一段
    <script type="text/javascript">
    thisURL = (document.URL).toLowerCase( );
    if (thisURL.indexOf("index1")>0){
    document.getElementById("index1").className="now";
    document.getElementById("index2").className="";
    document.getElementById("index3").className="";
    document.getElementById("index4").className="";
    document.getElementById("index5").className="";
    document.getElementById("index6").className="";
    document.getElementById("index7").className="";
    document.getElementById("index8").className="";
    ...
    }if (thisURL.indexOf("index2")>0){
    document.getElementById("index1").className="";
    document.getElementById("index2").className="now";
    document.getElementById("index3").className="";
    document.getElementById("index4").className="";
    document.getElementById("index5").className="";
    document.getElementById("index6").className="";
    document.getElementById("index7").className="";
    document.getElementById("index8").className="";
    ....
    }
    if (thisURL.indexOf("index3")>0){
    document.getElementById("index1").className="";
    document.getElementById("index2").className="";
    document.getElementById("index3").className="now";
    document.getElementById("index4").className="";
    document.getElementById("index5").className="";
    document.getElementById("index6").className="";
    document.getElementById("index7").className="";
    document.getElementById("index8").className="";
    ....
    }
    .
    .
    .
    .
    </script>连接的是<a id="index1" class="now" href="a.asp">1</a>
    <a id="index2" href="b.asp">2</a>
    <a id="index3" href="c.asp">3</a>
    <a id="index4" href="d.asp">3</a>我写的这个没有循环的JS,可以激活NOW 这个样式
    例如我点A.ASP   NOW样式就激活,而B.ASP,C.ASP,D.ASP就没有激活
    然后我再点B.ASP,B.ASP的NOW样式就激活,而A,C,D那些都没有激活不知道我这样说清楚了没
      

  21.   

    <script type="text/javascript">
    function dean7788(o){
      var obj=document.getElementsByName('index')  
      for(var i=0;i<obj.length;i++){//先清空所有name为index的样式
        obj[i].className='';
      }
      o.className='now';//给你点击的A添加样式
    }
    </script>
    <a id="index1" name="index" href="a.asp" onmousedown='dean7788(this)'>1</a>
    <a id="index2" name="index" href="b.asp" onmousedown='dean7788(this)'>2</a>
    <a id="index3" name="index" href="c.asp" onmousedown='dean7788(this)'>3</a>
    <a id="index4" name="index" href="d.asp" onmousedown='dean7788(this)'>3</a>
      

  22.   

    你不就是想提示用户刚才点击的是哪个链接吗? 其实不用JS,你直接在页面的CSS里把用<a>的hover之类设置一下就可以了。
      

  23.   

    无论是新建页面还是原来上面测试了下,都不行,NOW带不进去
      

  24.   


    不是那样的我的NOW样式改变很多的
    .now{ display:block; background-color:#555353; height:37px; color:#d0ba55; margin:0 0 0 2px;text-decoration:none; width:78px ; _margin:0 0 0 2px;}我是要激活的效果例如1 2 3 4
    红色是NOW效果,是A.ASP点击了2后,也就是B.ASP
    2  3 4
      

  25.   

    你那个我试过了,不行,我重新写一个和套进去也不行,NOW出不来
      

  26.   

    <style type="text/css">
    .now{ color:#d0ba55; text-decoration:none; width:78px ;}a{float:left; display:block; background-color:#555353; height:37px; margin:0 0 0 2px;text-decoration:none; width:78px ; _margin:0 0 0 2px;}
    </style>
    <body>
    <script type="text/javascript">
    var oldobj;
    function dean7788(o){
      if (oldobj) {
    oldobj.className='';
      }
    oldobj = o;
      o.className='now';//给你点击的A添加样式
    }
    </script>
    <a id="index1" name="index" href="#" onmousedown='dean7788(this)'>1</a>
    <a id="index2" name="index" href="#" onmousedown='dean7788(this)'>2</a>
    <a id="index3" name="index" href="#" onmousedown='dean7788(this)'>3</a>
    <a id="index4" name="index" href="#" onmousedown='dean7788(this)'>3</a>
    </body>
      

  27.   


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html lang="ru">
    <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <style>
    .now{ display:block; background-color:#555353; height:37px; color:#d0ba55; margin:0 0 0 2px;text-decoration:none; width:78px ; _margin:0 0 0 2px;}
    </style>
    <script type="text/javascript">
    <!--
    window.onload = function()
    {
      var a = document.getElementsByTagName("a");
      for(var i=0;i<a.length;i++)
      {
        if(a[i].id.indexOf("index")!=-1)
        {
          a[i].onclick=function(){
           this.className="now";
           var a = document.getElementsByTagName("a");
           for(var j=0;j<a.length;j++)
       {
       if(a[j].id.indexOf("index")!=-1&&a[j].id!=this.id)
       {
         a[j].className="";
       }
       }
          };
        }
      }
    }
     
    //-->
    </script>
    </head>
    <body>
    <a id="index1" class="now" href="#">1</a>
    <a id="index2" href="#">2</a>
    <a id="index3" href="#">3</a>
    <a id="index4" href="#">4</a>
    </body>
    </html>
      

  28.   


    NOW传递不了,是不同页面
    哎呀真是辛苦大家了,我都过意不去
      

  29.   

    【NOW传递不了,是不同页面】:是什么意思?不同页面是指??
      

  30.   

    因为上面可以传递的href指向的都是 href"#",相当于本页刷新,这样是有NOW的效果但是分开到不同页面后,例如,A.ASP,B.ASP就没有那种效果你可以试下,分别把代码放进A.B两个页面上,测试下可以传递不
      

  31.   

    这样呢?asp获取参数我不熟悉,你自己改下:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html lang="ru">
    <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <style>
    .now{ display:block; background-color:#555353; height:37px; color:#d0ba55; margin:0 0 0 2px;text-decoration:none; width:78px ; _margin:0 0 0 2px;}
    </style>
    <script type="text/javascript">
    <!--
    window.onload = function()
    {
      var a = document.getElementsByTagName("a");
      var id = "<%=index//这里是asp获取参数的方式,我记不清了。%>";
      document.getElementById(id).className="now";
      for(var i=0;i<a.length;i++)
      {
        if(a[i].id.indexOf("index")!=-1&&a[i].id!=id)
        {      
        a[i].className="";
        }
      }
    }
     
    //-->
    </script>
    </head>
    <body>
    <a id="index1" class="now" href="a.asp?index=index1">1</a>
    <a id="index2" href="b.asp?index=index2">2</a>
    <a id="index3" href="c.asp?index=index3">3</a>
    <a id="index4" href="d.asp?index=index4">4</a>
    </body>
    </html>
      

  32.   

    兄弟,href"#"是在本页刷新而已;href="a.asp"是点击后本页跳转到一个新的页面,当然就基本上看不到now的效果了。所以我才用onmousedown给你示范的。不知道那几位兄弟href"#"给你是什么意思,呵呵。如果你不想本页跳转到其他页面,你可以打开新的窗口:
    <a id="index1" name="index" href="a.asp" target="_blank" onmousedown='dean7788(this)'>1</a>
    <a id="index2" name="index" href="b.asp" target="_blank" onmousedown='dean7788(this)'>2</a>
    <a id="index3" name="index" href="c.asp" target="_blank" onmousedown='dean7788(this)'>3</a>
    <a id="index4" name="index" href="d.asp" target="_blank" onmousedown='dean7788(this)'>3</a>
      

  33.   

    我明白楼主的意思,点击后页面跳转了,所以一个在加载事件
    判断url 和 菜单href 是否匹配来设置a 标签的样式
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html lang="ru">
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
        <style>
        .now{ display:block; background-color:#555353; height:37px; color:#d0ba55; margin:0 0 0 2px;text-decoration:none; width:78px ; _margin:0 0 0 2px;}    
        </style>
    <script type="text/javascript">
    <!--
    window.onload = function()
    {
      var menuList  = document.getElementsByTagName("a");
            var url = document.location.href;
            var hrefUrl = '';
            if(menuList==null || typeof(menuList)=='undefined')
            { return;}
            var index=0;
            for(;index < menuList.length;index++)
            {
                hrefUrl = menuList[index].href;
                hrefUrl = hrefUrl.substr(hrefUrl.lastIndexOf('/')+1);
                if(hrefUrl!='' && hrefUrl != '/')
                {
                    if(url.indexOf(hrefUrl) > 0 )
                    {
                        break;
                    }
                }
            }
            if(index <  menuList.length)
            {
                menuList[index].className="now";
            }else{
                 menuList[0].className="now"; // 没找到匹配的,设置第一个菜单
             }
     
    //-->
    </script>
    </head>
    <body>
    <a id="index1" href="a.html">1</a>
    <a id="index2" href="b.html">2</a>
    <a id="index3" href="c.html">3</a>
    <a id="index4" href="d.html">4</a>
    </body>
    </html>
      

  34.   

    其实我估计你们还没弄懂我意思简化,简化,我再简化大家可以测试下我给的页面,我放的是我的JS2个页面
    a.asp
    b.asp
    a和b的代码
    <style>
    a:link,a:visited{color:#505050; text-decoration:none;}
    a:hover{color:#0072dc}
    #menu{float:left; width:100px; height:18px; position:relative}
    #menu ul li{float:left; list-style:none}
    #menu ul li .now{color:#F00}
    </style>
    <body>
    <div id="menu">
         <ul>
           <li><a href="a.asp" id="a" class="now">这个就是A.ASP</a></li>
           <li><a href="b.asp" id="b">这个就是b.ASP</a></li>
         </ul>
    </div>
    </body>
    <script type="text/javascript">
    thisURL = (document.URL).toLowerCase( );
    if (thisURL.indexOf("a")>0){
    document.getElementById("a").className="now";
    document.getElementById("b").className="";
    }if (thisURL.indexOf("b")>0){
    document.getElementById("a").className="";
    document.getElementById("b").className="now";
    }
    </script>
      

  35.   


    <div id="linkNodes"><!--随便加个标签,方便获取里边的链接-->
    <a id="index1" class="now" href="a.asp">1</a>
    <a id="index2" href="b.asp">2</a>
    <a id="index3" href="c.asp">3</a>
    <a id="index4" href="d.asp">3</a>
    </div>window.onload=function(){
    var nodes=document.getElementById("linkNodes").getElementsByTagName("a");
    var url=document.location.href.toLowerCase();
    for(var i=0;i<nodes.length;i++){
    if(url.indexOf(nodes[i].href.toLowerCase())>=0){//注意这里的判断就可以了,目前是判断<a/>标签的href是否出现于当前浏览器地址
    nodes[i].className="now";
    }else{
    nodes[i].className="";
    }
    }
    }
      

  36.   

    我明白楼主的意思,点击后页面跳转了,所以一个在加载事件
    判断url 和 菜单href 是否匹配来设置a 标签的样式逻辑是这样,这段代码没测试。不过我有项目是这样做的!逻辑是没问题的!
    楼主自己根据你的逻辑修改<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html lang="ru">
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
        <style>
        .now{ display:block; background-color:#555353; height:37px; color:#d0ba55; margin:0 0 0 2px;text-decoration:none; width:78px ; _margin:0 0 0 2px;}    
        </style>
    <script type="text/javascript">
    <!--
    window.onload = function()
    {
      var menuList  = document.getElementsByTagName("a");
            var url = document.location.href;
            var hrefUrl = '';
            if(menuList==null || typeof(menuList)=='undefined')
            { return;}
            var index=0;
            for(;index < menuList.length;index++)
            {
                hrefUrl = menuList[index].href;
                hrefUrl = hrefUrl.substr(hrefUrl.lastIndexOf('/')+1);
                if(hrefUrl!='' && hrefUrl != '/')
                {
                    if(url.indexOf(hrefUrl) > 0 )
                    {
                        break;
                    }
                }
            }
            if(index <  menuList.length)
            {
                menuList[index].className="now";
            }else{
                 menuList[0].className="now"; // 没找到匹配的,设置第一个菜单
             }
     
    //-->
    </script>
    </head>
    <body>
    <a id="index1" href="a.html">1</a>
    <a id="index2" href="b.html">2</a>
    <a id="index3" href="c.html">3</a>
    <a id="index4" href="d.html">4</a>
    </body>
    </html>
      

  37.   


    <style>
    a:link,a:visited{color:#505050; text-decoration:none;}
    a:hover{color:#0072dc}
    #menu{float:left; width:100px; height:18px; position:relative}
    #menu ul li{float:left; list-style:none}
    #menu ul li .now{color:#F00}
    </style>
    <body>
    <div id="menu">
         <ul>
           <li><a href="a.asp?id=a" id="a" name="index">这个就是A.ASP</a></li>
           <li><a href="b.asp?id=b" id="b" name="index">这个就是b.ASP</a></li>
         </ul>
    </div>
    </body>
    <script type="text/javascript">
    window.onload=function(){
      var thisURL = location.search.toLowerCase();
      var id=thisURL.split('=')[1];
      var obj=document.getElementsByName('index')  
      for(var i=0;i<obj.length;i++){
        obj[i].className=obj[i].id==id?'now':'';
      }
    }
    </script>
      

  38.   


    thisURL = (document.URL).toLowerCase( );
    var origin = null;
    for(var i = 1; i <= 100;i++){
        if(thisURL.indexOf("index" + i)>0){
            if(origin) origin.className = "";
            origin = document.getElementById("index" + i);
            origin.className="now";
        }
    }
    </