SitePoint Sponsor

User Tag List

Results 1 to 11 of 11
  1. #1
    SitePoint Addict miggl's Avatar
    Join Date
    Feb 2007
    Location
    Los Angeles, CA
    Posts
    286
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Manipulate HTMLCollection

    How can I manipulate an HTMLCollection that is returned by, lets say, getElementsByName(). Say I want to remove some items from the collection, how can this be achieved?

    Thanks!
    Celebrate Liberty, Freedom, and Rights at The Constitutionalist.

  2. #2
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,869
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    Since the collection is just a way of referencing the elements in the page, to remove elements from the collection you simply delete them from the page using whatever method you usually use to delete HTML elements.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  3. #3
    SitePoint Addict miggl's Avatar
    Join Date
    Feb 2007
    Location
    Los Angeles, CA
    Posts
    286
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Here's the rub though: I want them to stay on the page, I just want to reduce my collection by certain items.
    Celebrate Liberty, Freedom, and Rights at The Constitutionalist.

  4. #4
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,869
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    The collection is the elements on the page so the only way to do what you want is to copy the selected elements info from the collection into an array.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  5. #5
    SitePoint Addict miggl's Avatar
    Join Date
    Feb 2007
    Location
    Los Angeles, CA
    Posts
    286
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That's not entirely true though, at least not in my understanding. A collection is a set of references to objects on the page. As you can have many different collections on the same page that overlap each other, i.e. using getElementsByTagName(), getElementsByName, etc.

    Thus is should be possible to add or remove references from the collection object.

    I have been able to figure out how to extend objects by themselves, however, extending object collections still eludes me.
    Celebrate Liberty, Freedom, and Rights at The Constitutionalist.

  6. #6
    rajug.replace('Raju Gautam'); bronze trophy Raju Gautam's Avatar
    Join Date
    Oct 2006
    Location
    Kathmandu, Nepal
    Posts
    4,013
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    How will you know which element is to be removed from the collection? I suppose that you already found a collection with getElementByTagName().
    Mistakes are proof that you are trying.....
    ------------------------------------------------------------------------
    PSD to HTML - SlicingArt.com | Personal Blog | ZCE - PHP 5

  7. #7
    SitePoint Addict miggl's Avatar
    Join Date
    Feb 2007
    Location
    Los Angeles, CA
    Posts
    286
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That's the whole point of what I'm trying to do: I want to extend the collection object with the getElementsxxxx() functions. Unfortunately I have only been able to extend individual objects, but not collections.
    Celebrate Liberty, Freedom, and Rights at The Constitutionalist.

  8. #8
    rajug.replace('Raju Gautam'); bronze trophy Raju Gautam's Avatar
    Join Date
    Oct 2006
    Location
    Kathmandu, Nepal
    Posts
    4,013
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Is that collection created by your javascript (or other some scripting) code or the collection has been created in design time?? If you have created in run-time then i think you can have different or similar but not same names of the collection elements. I dont know what i understood..?
    Mistakes are proof that you are trying.....
    ------------------------------------------------------------------------
    PSD to HTML - SlicingArt.com | Personal Blog | ZCE - PHP 5

  9. #9
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,869
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    Collections are not pure JavaScript because they have an HTML component to them as well (the elements on the page that are in the collection). The easiest way to change the content of a collection is to change the HTML since the collection is simply a way of accessing the HTML from within JavaScript.

    While some of the JavaScript syntax for a collection is similar to that for an object or array they are nothing alike. You can copy parts of elements from a collection to an array and can be selective as to which elements you copy. That will leave you with an array though rather than a collection and changes to the array will then not reflect back in the HTML.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  10. #10
    SitePoint Enthusiast tenfingers's Avatar
    Join Date
    May 2004
    Location
    Alberta, Canada
    Posts
    93
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question off-topic by tangent

    (Sorry to cut in...)
    Quote Originally Posted by felgall View Post
    ...
    While some of the JavaScript syntax for a collection is similar to that for an object or array they are nothing alike. ...
    Would this apply to the newbie problem, posted as
    Registering events in IE?

  11. #11
    SitePoint Guru Chroniclemaster1's Avatar
    Join Date
    Jun 2007
    Location
    San Diego, CA
    Posts
    784
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by felgall View Post
    You can copy parts of elements from a collection to an array and can be selective as to which elements you copy. That will leave you with an array though rather than a collection and changes to the array will then not reflect back in the HTML.

    That's the key element, because you're working with the array, it doesn't affect the elements on your page, so you can select whatever elements you want for your array and it doesn't destroy your page (well... you could affect the collection if you wanted to manipulate/destroy your page ). But as soon as you call the getElementsByName() the result is an array, so it happens just that fast. So throw conditionals at it, run for loops to grab only the ones with a class="grabMe" or whatever. Then once you have exactly the array of elements that you want, you can manipulate them in whatever way you're going to.
    Whatever you can do or dream you can, begin it.
    Boldness has genius, power and magic in it. Begin it now.

    Chroniclemaster1, Founder of Earth Chronicle
    A Growing History of our Planet, by our Planet, for our Planet.


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
  •