JavaScript: trasformare una NodeList in un array

JavaScript: trasformare una NodeList in un array

Nel DOM le collezioni di nodi (NodeList) sono dei tipi di dati che presentano delle similarità con gli array pur non essendo array. Possiamo tuttavia trasformare tali collezioni in array tramite una semplice procedura. Vediamola insieme.

Definiamo la seguente funzione:


function HTMLNodesToArray(reference, elems) {
    
    
    reference = document.getElementById(reference);
    elems = elems || '*';
    var nodes = [];
    
    var elements = reference.getElementsByTagName(elems);
    var i;
    var len = elements.length;
    
    for(i = 0; i< len; i += 1) {
        
        
        var node = elements[i];
        nodes.push(node);
        
        
    }
    
    return nodes;
}

La funzione esegue un'iterazione attraverso la NodeList specificata e inserisce ciascun nodo in un array che alla fine viene restituito come valore di ritorno della funzione. Esempio d'uso:


function showNodes() {
    
    var htmlNodes = HTMLNodesToArray('test', 'li'),
        len = htmlNodes.length,
        j;
        
    for(j = 0; j < len; j += 1) {
    
    	console.log(htmlNodes[j].tagName + ' ' + htmlNodes[j].firstChild.nodeValue);
    
    }
    
        
    
}

window.onload = function() {
    
    
    showNodes();
    
};

Output nella console:

Torna su