CODEWITHSUNDEEP
javascript
user967451
user967451

Reputation:

getElementsByTagName: How to select more than one type of tag?

I have a for loop inside which I check to see if the current element being iterated has any a tags or form tags inside of it and if so I do some stuff to them. Anyway I can check either or like so:

var form_or_a_tag = elem[i].getElementsByTagName('a');
var form_or_a_tag = elem[i].getElementsByTagName('form');

But how can I combine them?

these all fail:

var form_or_a_tag = elem[i].getElementsByTagName('a form');
var form_or_a_tag = elem[i].getElementsByTagName('a, form');
var form_or_a_tag = elem[i].getElementsByTagName('a') || elem[i].getElementsByTagName('form');

Basically I would like to store in the variable form_or_a_tag all form or a tags that reside in the element currently being iterated.

Upvotes: 3

Views: 5543

Answers (4)

Greck
Greck

Reputation: 590

If sequence of nodes is important, here is pure Javascript solution:

var getNodesInTreeByNodeName = function (node, /*Array of Strings*/ allowed_node_names)
{
    var childCollection = [];
    var getTreeNodes = function (tree_root)
    {
        if (allowed_node_names.indexOf(tree_root.nodeName) > -1)
            childCollection.push(tree_root);
        var childs = tree_root.childNodes;
        if (childs)
            for (var i=0, childs_length=childs.length ; i<childs_length ; i++)
                getTreeNodes(childs[i]);
    };
    getTreeNodes(node);
    return childCollection;
};

Example of use:

    var node_types = ["A","FORM"];
    var nodes = getNodesInTreeByNodeName(window.document, wanted_nodes);

Upvotes: 0

Salman Arshad
Salman Arshad

Reputation: 272146

This might work:

var nodelist_a    = elem[i].getElementsByTagName('a');         // NodeList
var nodelist_form = elem[i].getElementsByTagName('form');      // NodeList

var array_a       = Array.prototype.slice.call(nodelist_a);    // Array
var array_form    = Array.prototype.slice.call(nodelist_form); // Array

var array_both    = array_a.concat(array_form);                // Array

Note that the result is no longer a NodeList but an Array; however each item is a Node.

Upvotes: 5

jlx84
jlx84

Reputation: 101

I do not think that this function supports this feature. AFAIK you can use only getElementsByTagName("*") wildcard to select all nodes. You can try some library like Sizzle to use CSS selectors.

Upvotes: 0

gen_Eric
gen_Eric

Reputation: 227270

You can use querySelectorAll.

var form_or_a_tag = elem[i].querySelectorAll('a, form');

Upvotes: 5

Related Questions