Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New Coder
    Join Date
    Jun 2002
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts

    How to change 'class' in <A> dynamically ?

    Hello,
    I have this structure :
    <a href="xxx" class="menu"> .... </a>
    How to find the object of this <a> tag from javascript and
    how to change the class of this <a> tag dynamically from javascript?

    thank you very much

  • #2
    Senior Coder
    Join Date
    Jun 2002
    Posts
    1,404
    Thanks
    2
    Thanked 32 Times in 32 Posts
    <html>
    <head>
    <title>untitled</title>
    <style type="text/css">

    .oldclass {
    color: #00ff00;
    }

    .newclass {
    color: #ff0000;
    }

    </style>
    </head>
    <body>
    <a id="a1" class="oldclass" href="#">test</a><br><br>
    <a href="#"
    onclick="document.getElementById('a1').className='newclass'">change class</a>
    </body>
    </html>

  • #3
    New to the CF scene
    Join Date
    Oct 2004
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Applying Styles to Multiple ID's

    I am trying to change the color of text using Classes on specific row or rows depending on the month. There are two rows that are numbered id="11". Only the first row with id="11" is changed. What gives...?

    Please look at the following script:

    <script>
    now = new Date();
    month = now.getMonth();

    function SetStyle(){
    document.getElementById(month).className='newclass'
    }
    </script>

    <table>
    <tr id="10">
    <td>
    Blah Blah Blah
    </td>
    </tr>
    <tr id="11">
    <td>
    Blah Blah Blah
    </td>
    <td>
    Blah Blah Blah
    </td>
    </tr>
    <tr id="11">
    <td>
    Blah Blah Blah
    </td>
    <td>
    Blah Blah Blah
    </td>
    </tr>
    </table>
    Last edited by drecksau; 11-02-2004 at 07:16 PM.

  • #4
    Regular Coder
    Join Date
    Oct 2004
    Posts
    168
    Thanks
    0
    Thanked 5 Times in 5 Posts
    getElementById is intended to reference uniquely.
    Amend your SetStyle function as follows so that you can reference by array :

    function SetStyle(){

    var totalTRs = document.getElementsByTagName("tr").length;

    for(i=0; i < totalTRs; i++)
    {
    document.getElementsByTagName("tr")[i].id == month ?
    document.getElementsByTagName("tr")[i].className='newclass' : "";
    }
    }

  • #5
    New to the CF scene
    Join Date
    Oct 2004
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Puffin the Erb
    getElementById is intended to reference uniquely.
    Amend your SetStyle function as follows so that you can reference by array :

    function SetStyle(){

    var totalTRs = document.getElementsByTagName("tr").length;

    for(i=0; i < totalTRs; i++)
    {
    document.getElementsByTagName("tr")[i].id == month ?
    document.getElementsByTagName("tr")[i].className='newclass' : "";
    }
    }
    You are the man... Thanks a bunch.


    Drecksau

    ...it said, "Windows 2000 or better." So I installed Linux...

  • #6
    Senior Coder
    Join Date
    Jun 2002
    Posts
    1,404
    Thanks
    2
    Thanked 32 Times in 32 Posts
    Last edited by adios; 11-02-2004 at 09:46 PM.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •