Como fazer loop através dos elementos HTML sem usar o loop foreach em javascript?

Sempre que pensamos em loop nos elementos html, nossas mentes se desviam para o loop foreach (). Mas e se tivermos que percorrer os elementos HTML sem usar o loop for-Each em JavaScript? Temos qualquer outra abordagem para loop através de elementos HTML em JavaScript?

Bem! Lanrar -se através de elementos HTML é uma tarefa muito comum, então, o JavaScript oferece várias abordagens que podem ser usadas para esse fim (i.e. Loop através de elementos).

Este artigo explicará como fazer um loop através dos elementos HTML sem usar o loop foreach () em JavaScript e, nesse sentido, cobrirá as abordagens abaixo da lista abaixo:

• Looping através de elementos HTML usando o javascript for-loop
• Looping através de elementos HTML usando JavaScript para loop/declarações
• Looping através dos elementos HTML usando JavaScript enquanto Loop

Então vamos começar!

Looping através de elementos HTML usando o javascript for-loop

Em JavaScript, uma das abordagens mais usadas para percorrer os elementos HTML é o loop.

Exemplo: Loop através do elemento

Neste programa, percorreremos os elementos da etiqueta HTML usando o Javascript For-Loop:

Html

Primeiro nome:





Sobrenome:





OK

Aqui está o resumo do arquivo html:

• Criou duas tags "etiquetas" i.e. Primeiro nome e sobrenome.
• Utilizou o
  Tags para adicionar quebras de linha.
• Criou dois campos de entrada e um botão.

JavaScript

var Traverse_Element = documento.getElementsByTagName ("Label");
para (var i = 0; i < traverse_Element.length; i++)
console.log ("elemento atual", transverse_element [i]);

O arquivo JavaScript executou as seguintes tarefas:

• Utilizou o método "getElementsbytagname" para obter a coleta do elemento especificado (i.e. elemento de etiqueta no nosso caso).
• Utilizou o loop para iterar os elementos html.
• Utilizou a propriedade de comprimento para obter o número de elementos HTML para ser iterado/atravessado.
• Imprimiu o elemento atual usando o console.Método log ().

Saída:

A saída esclareceu que o loop for atravessado por todos elementos.

Looping através de elementos HTML usando JavaScript para loop/declarações

O loop for do. Ele nos permite iterar sobre os objetos iteráveis, como matrizes, cordas, conjuntos e assim por diante.

Exemplo: Loop através do elemento

Neste programa, percorreremos os elementos do botão HTML usando o JavaScript for-of Loop:

Html

Os arquivos HTML permanecerão os mesmos do exemplo anterior.

JavaScript

var Traverse_Element = documento.getElementsByTagName ("Button");
para (elemento de Traverse_Element)
console.log (elemento);

Desta vez, utilizamos as declarações para os elementos para todos os elementos:

É assim que o loop for-of é usado para atravessar elementos HTML.

Looping através dos elementos HTML usando JavaScript enquanto Loop

Podemos usar o JavaScript enquanto loop para iterar através dos elementos HTML. O exemplo abaixo do ritmo o guiará sobre como usar o loop "while" para iterar através dos elementos HTML:

Exemplo: passe por todos os elementos

Neste programa, percorreremos todos os elementos HTML usando JavaScript enquanto Loop:

var Traverse_Element = documento.getElementsByTagName ("*");
var contador = 0;
enquanto (contador < traverse_Element.length)
console.log (transverse_element [i]);
contador ++;

Neste programa de exemplo, passamos o "*" para o método "getElementByTagName ()" para iterar através de todos os elementos html. Em seguida, utilizamos a propriedade de comprimento dentro do while loop para obter o número de elementos HTML a ser iterado/perseguir.

É assim que podemos fazer um loop através dos elementos HTML sem usar o método foreach () em javascript.

Conclusão

O JavaScript oferece várias abordagens que não forem o loop que podem ser usadas para dar um loop através de elementos HTML, como loop, loop para loop e enquanto o loop. Ao fazer o loop através dos elementos HTML, o método "getElementsbytagname" pode ser usado para obter a coleta do elemento especificado. Este post explicou o funcionamento de várias abordagens para percorrer os elementos HTML em JavaScript.