Aplicar funções em grupo de elementos pelo JQuery

var divs   = $('div'); // obtem um array de elementos div da sua página.
// aplica uma borda em todos os elementos DIV da página.
var divs = $('div').attr('style', 'border: 1px solid blue');

var divs = $('div'); // obtem um array de elementos div da sua página.

// aplica uma borda em todos os elementos DIV da página.

var divs = $('div').attr('style', 'border: 1px solid blue');

Com este recurso você evita de ter que fazer laços de repetição para os arrays retornados pelos seletores do JQuery. O exemplo abaixo mostra o mesmo caso de cima mas usando um laço ‘each‘.

var divs = $('div');
divs.<a href="http://api.jquery.com/each/" target="_blank">each</a>(function(indice, elemento){
   $(elemento).attr('style', 'border: 1px solid blue');
});

var divs = $('div');

divs.<a href="http://api.jquery.com/each/" target="_blank">each</a>(function(indice, elemento){

$(elemento).attr('style', 'border: 1px solid blue');

});

Você também pode aplicar funções de plugins do JQuery que você tenha importado na sua página, como por exemplo o método ‘mask‘ do plugin Masked Input Plugin, só que neste caso estou aplicando a todos os elementos INPUT de uma página qualquer.

//Aplicando diretamente.
var inputs = $('input[type=text]').mask('99/99/9999');

// Exemplo com a função each
var inputs = $('input[type=text]');

inputs.each(function(indice, elemento){
  $(elemento).mask('99/99/9999');
});

//Aplicando diretamente.

var inputs = $('input[type=text]').mask('99/99/9999');

// Exemplo com a função each

var inputs = $('input[type=text]');

inputs.each(function(indice, elemento){

$(elemento).mask('99/99/9999');

});

Para dúvidas, perguntas, sugestões, críticas, etc utilizem a área de comentários abaixo.

Um abraço a todos.

Share: