Manipulate HTMLCollection

[miggl]

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!

[felgall]

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.

[miggl]

Here's the rub though: I want them to stay on the page, I just want to reduce my collection by certain items.

[felgall]

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.

[miggl]

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.

[Raju Gautam]

How will you know which element is to be removed from the collection? I suppose that you already found a collection with getElementByTagName().

[miggl]

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.

[Raju Gautam]

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..?

[felgall]

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.

[tenfingers]

(Sorry to cut in...)

...
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?

[Chroniclemaster1]

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.