Question

How to join 2 Arrays containing DOM Elements.

I am trying to concat 2 or more array that contain Selectbox elements. Here is my sample code.

selectboxes = [];
for(var i = 0; i < forms.length; i++)
{
selectboxes = selectboxes.concat(forms[i].getElementsByTagName('select'))
}

but it’s not working. Any tip?

Answer 1

JavaScript’s getElementsByTagName function does not return an array it returns a NodeList which does not have a concat method.

https://developer.mozilla.org/en/DOM/element.getElementsByTagName

See this answer: JavaScript NodeList

For an example of how to put them in one array.

I think the best solution would be this:

http://jsfiddle.net/4CKRN/

— UPDATE for your specific code —

forms = document.forms;
selectboxes = [];
for(var i = 0; i < forms.length; i++)
{
   selectboxes = selectboxes.concat(Array.prototype.slice.call(forms[i].getElementsByTagName('select')));
}

​
Keep in mind if you just wanted to get all the selectboxes you could skip selecting them from within the forms and just select them from document.getElementsByTagName(“select”)

Of course, then you may get select boxes that weren’t meant for forms though (occasionally select boxes are used for navigation or other non-standard reasons).