Outro vídeo conceitual! Isso é “apenas uma daquelas coisas” que você precisa entender em jQuery. Na verdade, é um pouco exclusivo do jQuery, visto que outras bibliotecas JavaScript populares no passado não o faziam dessa maneira.
Já cobrimos um pouco os seletores. Por exemplo, você já sabe que $("p")selecionará todos os parágrafos de uma página. Não apenas o primeiro ou algum aleatório, todos eles. Você pode facilmente imaginar que pode haver muitos deles em uma página. Agora imagine o que acontece quando você faz:
$("p").hide();Todos eles ficam escondidos certo? Direita. Não o primeiro ou algum aleatório, todos eles. Essa iteração implícita . Nos bastidores, o jQuery percorre automaticamente todo o conjunto de elementos que encontrou e executa o método que você escolheu neles. Não precisamos literalmente escrever um loop para fazer isso. Parece bastante óbvio se você for uma introdução ao JavaScript em jQuery, mas muitas bibliotecas no passado exigiam que você fizesse um loop em coleções de elementos.
Se quiser, você ainda pode escrever o loop sozinho. Isso talvez se pareça com isso, usando métodos de loop jQuery:
$("p").each(function() ( $(this).hide(); ));É quase a mesma coisa. Não necessariamente, mas você poderia. Isso é iteração explícita .
Às vezes, você precisa fazer iteração explícita. Basicamente, se precisarmos acessar o valor de thise fazer algo especial com ele, precisaremos de nossa própria construção de loop para trabalhar.
O exemplo neste screencast contava os caracteres em itens da lista e acrescentava isso ao final da string. Precisamos de iteração explícita para isso.
Veja a caneta 4b53b9f55662d0d26339e18277500eee de Chris Coyier (@chriscoyier) no CodePen
Usamos o método each () da jQuery aqui, que é perfeito para o que precisamos. Uma coisa útil que ele faz para nós é nos dar um contador com índice zero de cada iteração que podemos acessar, se necessário.
$(".there-are-three-of-me").each(function(i) ( console.log(i); )); // 0 // 1 // 2