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 8 of 8
  1. #1
    Regular Coder
    Join Date
    Jun 2002
    Posts
    553
    Thanks
    0
    Thanked 0 Times in 0 Posts

    getElementById Puzzle

    I am using a function that accepts as input the object from getElementById like so:
    changeIt(document.getElementById('test'))

    which works if the element in question has id coded, like so:
    <img id="test" src="cov1.jpg" width="263" height="338">

    If I am in a situation where the element does not have id coded and I cannot change that, how can I chain through the img elements in the document, and what exactly do I have to pass to the changeIt function so that it will be same kind of object as document.getElementById('test')?

    G

  • #2
    GŁtkodierer
    Join Date
    Apr 2009
    Posts
    2,127
    Thanks
    1
    Thanked 426 Times in 424 Posts
    Code:
    for(var i = 0; i < document.images.length; i++){
    	changeIt(document.images[i]);
    }

  • #3
    Regular Coder
    Join Date
    Jun 2002
    Posts
    553
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks very much, Venegal... However, I only want to invoke the changeIt function for that one specific image. So as I run the chain of images, is there a way to access the file name so I know which image in the document to run the changeIt function on?

    Ted

  • #4
    GŁtkodierer
    Join Date
    Apr 2009
    Posts
    2,127
    Thanks
    1
    Thanked 426 Times in 424 Posts
    You mean you want to changeIt a particular <img> which you can only identify by its src?

    Code:
    for(var i = 0; i < document.images.length; i++){
    	if (document.images[i].src == 'cov1.jpg') changeIt(document.images[i]);
    }

  • #5
    Regular Coder
    Join Date
    Jun 2002
    Posts
    553
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Yes, I'm afraid so. It is a site where I can add some javascript logic, but I cannot change the page markup, which is built by server side logic. The img is contained within a div like so:
    <div class="img_1">
    <a id="image1" href="whatever">
    <img src="cov1.jpg" width="263" height="338" title="image1"></a>
    </div>

    G

  • #6
    GŁtkodierer
    Join Date
    Apr 2009
    Posts
    2,127
    Thanks
    1
    Thanked 426 Times in 424 Posts
    Well did you try the code I gave you in my last post?

  • #7
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,449
    Thanks
    76
    Thanked 4,373 Times in 4,338 Posts
    Venegal's code works, but you could also do this:
    Code:
    var anchor = document.getElementById("image1");
    var image = anchor.getElementsByTagName("img")[0]; // first image in the <a>...</a>
    changeIt(image);
    As long as you have *some* surrounding element with an ID, finding a sub-element via its tag name can be done that way.

    SO you *could* do
    Code:
    changeIt( document.getElementById("image1").getElementsByTagName("img")[0] );

  • #8
    Regular Coder
    Join Date
    Jun 2002
    Posts
    553
    Thanks
    0
    Thanked 0 Times in 0 Posts
    yes, venegal, that worked nicely -- thanks so much!

    Old Pedant -- Thanks, your approach is the specific solution I needed. Thanks both of you for all the help!

    Ted


  •  

    Posting Permissions

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