SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Evangelist Brandon Luhring's Avatar
    Join Date
    Apr 2002
    Location
    IN, USA
    Posts
    455
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Problem with array.push()

    I'm trying to extend the very nice image swap code from http://www.hesido.com

    He creates an array of <img /> tags using .getElementsByTagName(). And I want to extend it to also look for <input /> tags with type="image".

    I figured this would be easy with the array.push(), but I'm getting errors.

    Here's the code in question:
    Code JavaScript:
     
    imgList = elem.getElementsByTagName('img'); 
    inptList = elem.getElementsByTagName('input');
     
    alert(imgList.length); //returns 39
    alert(inptList.length); //returns 13
     
    //append input images to imgList
    for (var i=0; inpt = inptList[i]; i++) { 
    if(inpt.type == 'image'){
    //inpt equals the object it should...
    imgList.push(inpt); //erors here
    }
    }
     
    alert(imgList.length); //never runs this

    In IE7, I get the error "Object doesn't support this property or method".

    In FireFox, I get the error "uncaught exception: Permission denied to get property HTMLDivElement.parentNode"

    Any help would be greatly appreciated!

    Thanks,
    Brandon

  2. #2
    Guru in training bronze trophy SoulScratch's Avatar
    Join Date
    Apr 2006
    Location
    Maryland
    Posts
    1,838
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well, I believe getElementsByTagName() returns a nodelist which isnt a full fledged array. I think you'll need to loop through and add each item to a new array.

    e.g.

    Code:
    imageArray = [], allImages = document.getElementsByTagName('img'); 
    for (var i=0; i<allImages.length; i++) { 
    imageArray.push(allImages); 
    } 
    inputArray = [], allInputs = document.getElementsByTagName('input'); 
    for (var j=0; j<allInputs.length; j++) { 
    inputArray.push(allInputs); 
    }
    This is the only way I know so far of how to get it to work. Maybe someone else has another smarter way to get a node list to have the push method.

  3. #3
    SitePoint Wizard
    Join Date
    Nov 2004
    Location
    Nelson BC
    Posts
    2,310
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    This should work, creates a new array called imgList populated with references to DOM nodes of type img and input type=image
    Code:
    var imgList = [];
    
    var stuff = elem.getElementsByTagName('img');
    for (var i=0; i < stuff.length; i++) {
    	imgList.push(stuff[i]);
    }
    
    var stuff = elem.getElementsByTagName('input');
    for (var i=0; i < stuff.length; i++) {
    	if (stuff[i].type == "image") {
    		imgList.push(stuff[i]);
    	}
    }
    
    alert(imgList.length);

  4. #4
    SitePoint Evangelist Brandon Luhring's Avatar
    Join Date
    Apr 2002
    Location
    IN, USA
    Posts
    455
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks, guys!

    You are spot-on with those suggestions. It is working wonderfully, now.


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
  •