Объединение массивов, возвращаемых getElementsByWh независимо

Question

Я пытаюсь получить все элементы формы в определенном div и объединить их в один массив, используя метод concat ():

var div_id = 'some_div_id'; // in real life this is passed as a function parameter

var child_inputs = document.getElementById(div_id).getElementsByTagName('input');
var child_textareas = document.getElementById(div_id).getElementsByTagName('textarea');
var child_selects = document.getElementById(div_id).getElementsByTagName('select');

var field_elements = child_inputs.concat(child_textareas, child_selects); // this doesnt work?

Однако скрипт завершается неудачно в последней строке IЯ не уверен, почему.Я не могу использовать .childNodes, потому что переданный div_id не является прямым родителем.

Answer 1

getElementsByTagName возвращает NodeList не массив, поэтому вы не можете использовать concat.

Если вы хотите «преобразовать» nodeList в массив, вы можете вызвать slice из цепочки прототипов Array:

var div_id = 'some_div_id',
    divIdElement = document.getElementById(div_id); //cache the element

var getArrayFromTag = function(tagname) {
     //get the NodeList and transform it into an array
     return Array.prototype.slice.call(divIdElement.getElementsByTagName(tagname));
}

//Get the arrays
var child_inputs = getArrayFromTag('input');
var child_textareas = getArrayFromTag ('textarea');
var child_selects = getArrayFromTag ('select');

//use concat
var field_elements = child_inputs.concat(child_textareas, child_selects);

Answer 2

Эти методы не возвращают массив.Вместо этого это NodeList или, возможно, HTMLCollection .(См. примечание под синтаксисом. )

. Вы можете выполнить цикл по каждому списку узлов и сформировать их массив «вручную».