SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Enthusiast
    Join Date
    Nov 2005
    Location
    UK
    Posts
    55
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Changing innerHTML

    Hi

    I haven't quite mastered javascript yet, but my Sitepoint book is on the way and hopefully it will help!!

    My problem is I can use the following

    Code:
    document.getElementById('companyname').innerHTML="Company <span style='color:#446;'>NAME<\/span>"
    But obviously that is for an id, however I need to do the same but I want to change a few class elements.

    I have found the following code but I am unable to implement it, I don't even know if what I am doing is possibly?

    Code:
    function getElementsByClass(node,searchClass,tag) {
    var classElements = new Array();
    var els = node.getElementsByTagName(tag); // use "*" for all elements
    var elsLen = els.length;
    var pattern = new RegExp("\\b"+searchClass+"\\b");
    for (i = 0, j = 0; i < elsLen; i++) {
     if ( pattern.test(els[i].className) ) {
     classElements[j] = els[i];
     j++;
     }
    }
    return classElements;
    }
    
    function changeCompany()
    {
    var myEls = getElementsByClass(document,'companyname','span');
    myEls.innerHTML="precise:<span style='color:#446;'>new media<\/span>");
    }
    
    <body onload="changeCompany();">
    I hope somebody can help me with this or tell me if I am at least heading in the right direction.

    Thanks very much in advance.

    Jon
    Last edited by baby2boy; Aug 10, 2006 at 05:13.

  2. #2
    SitePoint Enthusiast
    Join Date
    Nov 2005
    Location
    UK
    Posts
    55
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    UPDATE...

    Code:
    <\/span>");
    should read

    Code:
    <\/span>";

  3. #3
    SitePoint Evangelist
    Join Date
    Apr 2006
    Location
    Halifax, Canada
    Posts
    498
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    What is the problem you are having with the second code?
    Paul Butler.org
    JSSpamBlock - Reduce WordPress spam.

  4. #4
    SitePoint Member
    Join Date
    Aug 2006
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Surely your getElementsByClass function is returning an array and you need to loop over the elements of the array setting the innerHTML of each.

    Replace:
    Code:
    myEls.innerHTML="precise:<span style='color:#446;'>new media<\/span>");
    With:
    Code:
    for ( i = 0; i < myEls.length; i++ )
    {
        myEls[i].innerHTML="precise:<span style='color:#446;'>new media<\/span>");
    }

  5. #5
    SitePoint Enthusiast
    Join Date
    Nov 2005
    Location
    UK
    Posts
    55
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Thumbs up

    Scimon, thanks very much that's sorted it out a treat. Nice one


Bookmarks

Posting Permissions

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