javascript - w3schools - what is dom in jquery




Javascript: Como percorrer todos os elementos DOM em uma página? (6)

Eu estou tentando fazer um loop sobre todos os elementos em uma página, então eu quero verificar cada elemento que existe nesta página para uma classe especial.

Então, como eu digo que eu quero verificar todos os elementos?


Andy E. deu uma boa resposta.

Gostaria de acrescentar, se você sentir para selecionar todos os filhos em algum seletor especial (isso precisa acontecer comigo recentemente), você pode aplicar o método "getElementsByTagName ()" em qualquer objeto DOM que você deseja.

Por exemplo, eu precisava apenas analisar parte "visual" da página da Web, então eu apenas fiz isso

var visualDomElts = document.body.getElementsByTagName('*');

Isso nunca levará em consideração a parte principal.


Aqui está outro exemplo de como você pode percorrer um documento ou um elemento:

function getNodeList(elem){
var l=new Array(elem),c=1,ret=new Array();
//This first loop will loop until the count var is stable//
for(var r=0;r<c;r++){
    //This loop will loop thru the child element list//
    for(var z=0;z<l[r].childNodes.length;z++){

         //Push the element to the return array.
        ret.push(l[r].childNodes[z]);

        if(l[r].childNodes[z].childNodes[0]){
            l.push(l[r].childNodes[z]);c++;
        }//IF           
    }//FOR
}//FOR
return ret;
}

Estava procurando o mesmo. Bem, não exatamente. Eu só queria listar todos os nós DOM.

var currentNode,
    ni = document.createNodeIterator(document.documentElement, NodeFilter.SHOW_ELEMENT);

while(currentNode = ni.nextNode()) {
    console.log(currentNode.nodeName);
}

Para obter elementos com uma classe específica, podemos usar a função de filtro.

var currentNode,
    ni = document.createNodeIterator(
                     document.documentElement, 
                     NodeFilter.SHOW_ELEMENT,
                     function(node){
                         return node.classList.contains('toggleable') ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_REJECT;
                     }
         );

while(currentNode = ni.nextNode()) {
    console.log(currentNode.nodeName);
}

Solução encontrada no MDN


Para aqueles que estão usando o Jquery

$("*").each(function(i,e){console.log(i+' '+e)});

Você pode tentar com document.getElementsByClassName('special_class');


a partir deste link
referência javascript

<html>
<head>
<title>A Simple Page</title>
<script language="JavaScript">
<!--
function findhead1()
{
    var tag, tags;
    // or you can use var allElem=document.all; and loop on it
    tags = "The tags in the page are:"
    for(i = 0; i < document.all.length; i++)
    {
        tag = document.all(i).tagName;
        tags = tags + "\r" + tag;
    }
    document.write(tags);
}

//  -->
</script>
</head>
<body onload="findhead1()">
<h1>Heading One</h1>
</body>
</html>

ATUALIZAÇÃO: EDIT

desde a minha última resposta eu encontrei melhor solução mais simples

function search(tableEvent)
    {
        clearResults()

        document.getElementById('loading').style.display = 'block';

        var params = 'formAction=SearchStocks';

        var elemArray = document.mainForm.elements;
        for (var i = 0; i < elemArray.length;i++)
        {
            var element = elemArray[i];

            var elementName= element.name;
            if(elementName=='formAction')
                continue;
            params += '&' + elementName+'='+ encodeURIComponent(element.value);

        }

        params += '&tableEvent=' + tableEvent;


        createXmlHttpObject();

        sendRequestPost(http_request,'Controller',false,params);

        prepareUpdateTableContents();//function js to handle the response out of scope for this question

    }




dom