Is it possible to make this function faster? Javascript

Question

I have a function that gets an array of DOM elements (based on tags) in a div.

Pseudocode:
1. Say I wanted to get all input and textarea elements within a table myTbl
2. Declare resultingArray = null
3. For each tag (ex: input, textarea)
4.   tagArray = Get all elements based on tag
5.   Create another array by manually looping through tagArray and adding 
it to resultingArray (the return type is dynamic collection and not an array.

Functionally this works, but it takes too much time. Is there a way to do what I'm trying to do faster?

Answer 1

Based on the idea of ​​Ben elements , here's another snapshot with a non-nested loop.

var tagNames = { 'SELECT' : true, 'INPUT' : true, 'TEXTAREA' : true }; //use an object for faster lookups
var rawElemsArray = document.getElementById("form-name").elements;
var elems = [];
for (var i = rawElemsArray.length - 1; i >= 0; i--) {
    if (tagNames[rawElemsArray[i].tagName]) {
        elems.push(rawElemsArray[i]);
    }
}

EDIT: form.elements 0 DOM, , -. childNodes ( -), . , childNodes (div, p, span ..), ( , IE), elements .

Answer 2

, jQuery

var $elements = jQuery( '#id-of-table input, #id-of-table textarea' );
$elements.each( function( i, element )
{
   // whatever you need here
} );

Answer 3

<form>, form.elements DOM. , :

var resultingArray = document.getElementById("form-name").elements;

Edit:

, , , , :

var result = [], nTags = tags.length, elements, nElements;

for (var i = 0; i < nTags; i++) {
    elements = table.getElementsByTagName(tag);
    nElements = elements.length;

    for (var j = 0; j < nElements; j++) {
        result.push(element);
    }
}

, XPath, (, IE, ).

var result = document.evaluate(tags.join("|"), table, null, XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE, null);

Answer 4

Array.slice HTMLCollection, . concat, , , :

function getElementsByTagNames(context, tags) {
    var res = [], 
        i = tags.length,
        slice = Array.prototype.slice;

    // Convert HTMLCollections to arrays and push onto the res array
    while(i--) res.push(slice.call(context.getElementsByTagName(tags[i])));

    // Use one concat call to merge all the arrays
    return Array.prototype.concat.apply([], res);
}

getElementsByTagNames(document.body, ['input', 'textarea']);

, . <input>, , <textarea> .

Answer 5

100%, , , ( , jQuery):

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
    function getStuff(){
        resultArr = [];
        var inputs = $('#myTbl').find('input');
        var tareas = $('#myTbl').find('textarea'); 
        // do the looping bit which I don't completely understand
    }
</script>

Answer 6

5 1200 ( )

, , , onclick onmouseover ( onclick hanlders td ). onclick textarea , .

jQuery!