Seletores baseados em atributos

Nesta seção, veremos como selecionar elementos de acordo com os atributos. Por exemplo, será possível selecionar todas as imagens (tag <img>) cujo atributo 'src' terminem com “.jpg”.

Para uma referência completa dos seletores baseados em atributos, dirija-se a: <http://api.jquery.com/category/selectors/attribute-selectors/>. Acesso em: 04 de março de 2015

A sintaxe para trabalharmos com atributos é informar dentro de chaves ([...]) o atributo, o operador (de igualdade, por exemplo) e o valor:

$([atributo operador valor])

Veja, a seguir, alguns exemplos comentados:

/ Modificando o valor de todos os elementos que possuam o atributo 'type'

// com valor igual a 'text'

$("[type='text']").val("test");

// Modificando o valor de todos os elementos que possuam o atributo 'name'

// com valor igual a 'teste1'

​

$("[name='teste1']").val("novo valor ...");

Para montar essas instruções, você poderá fazer uso dos seguintes operadores:

Veja um exemplo concreto, que seleciona todos os elementos cujo atributo 'name' é igual 'campoDeTestes2':

$("[name='campoDeTestes2']")

Novamente, os seletores recém apresentados também podem ser utilizados de maneira composta  com os demais seletores. Veja isso no exemplo a seguir, onde:

• A primeira linha recupera e armazena em “value” o valor do elemento cujo atributo 'name' seja igual a 'campoDeTestes2'.
• A segunda linha define o valor de todos os elementos do tipo 'input', cujo atributo ‘name’ seja igual a 'campoDeTestes2', como sendo igual ao valor da variável value.

var value = $("[name='campoDeTestes2']").val();

$("input[type='text'][name='campoDeTestes2']").val(value);