0

Sempre quando preciso selecionar mais de um elemento em uma página não é possível usar o querySelector() não é? Então devemos recorrer ao querySelectorAll(). Eu sempre o usei a seguinte maneira (img é só um exemplo hipotético):

img = document.querySelectorAll("img");
for (var i = 0; i < img.length; i++) {
    console.log(img[i]);
}

Porém outro dia em uma discussão com um amigo, nós chegamos a um impasse, e se existirem muitos elementos em uma página? Isso não poderia causar problemas para usuários que tem computadores mais lentos? Algo do gênero que um loop infinito faz..

Existe outra maneira de interagir com vários elementos com mesma gênero sem ter que se preocupar se isso não vai acabar atrapalhando a navegação do meu usuário?

1
  • Depende do que faça dentro do ciclo for, mas essa é a maneira "normal" de iterar listas de elementos. Pode é escrever o html com classes ou usando seletores com parentes para fazer a seleção mais pequena.
    – Sergio
    Commented 28/07/2014 às 20:35

3 Respostas 3

4

Se você precisa fazer algo com todos os elementos que casem com determinado seletor, a única maneira é fazer um loop sobre a lista desses elementos (seja ela obtida com o querySelectorAll ou por algum outro método, como getElementsByTagName).

Portanto, se há elementos demais sendo selecionados e isso está gerando lentidão no processamento, é preciso repensar o que estiver fazendo, para evitar ter de selecionar todos esses elementos, ou pelo menos evitar que sejam manipulados todos no mesmo momento. Mas isso somente será um problema se você perceber um problema real de performance num uso considerado "padrão" do site ou app (o que inclui o acesso utilizando uma máquina "padrão", um browser "padrão" e uma conexão "padrão"). Minha recomendação geral no seu caso: evite otimizações prematuras.

1
  • Ótimo: evite otimizações prematuras
    – gpupo
    Commented 28/07/2014 às 20:31
3

É Seguro usar o for

porem é preciso se atentar ao desempenho.

O forEach é de longe a pior opção para inteirar sobre um Array, o FOR, como foi citado é uma opção bem melhor porém a forma com que ele será feito impacta bastante, segue um link onde você mesmo pode testar esse desempenho

http://jsperf.com/for-vs-foreach/37

Para o meu caso os resultados foram os seguintes:

forEach

values.forEach(add);

operações por segundo: 1,327

for loop, simple

for (i = 0; i < values.length; i++) {
    sum += values[i];
}

operações por segundo: 10,559

for loop, cached length

length = values.length;
for (i = 0; i < length; i++) {
    sum += values[i];
}

operações por segundo: 10,584

for loop, reverse

for (i = values.length - 1; i >= 0; i--) {
    sum += values[i];
}

operações por segundo: 10,530

2

Sim, é seguro.

Obviamente, sempre existirá a chance do computador do cliente demorar para processar uma instrução, mas neste seu caso, não é uma preocupação válida.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .