Seletores jQuery - Parte 2

Na primeira parte do artigo, conhecemos as classificação dos elementos perante outros, e os seletores simples, compostos e de conteúdo. Para essa segunda parte vamos conhecer os seletores de visibilidade, de atributo e os filtros para seletores-filhos.

Seletores de Visibilidade

$(‘p:hidden’) - Acessa os elementos que estão ocultos, no caso seriam selecionados todas as ocorrências do elemento <p> que estiverem ocultas pela página.

$(‘p:visible’) - Acessa os elementos que estão visiveis (não ocultos) na página, no caso seriam selecionados todas as ocorrências do elemento <p> que esteverem visíveis na página.

Seletore de Atributo

$(‘a[title]’) - Seleciona os elementos que tiverem o atributo entre conchetes declarado, no caso seriam selecionados todos os elementos <a> que tiverem o atributo title declarados.

$(‘a[rel=”galeria”]’) - seleciona os elementos que tiverem o atributo declarado entre conchetes com valor igual ao informado no seletor entre aspas, no caso seriam selecionados os elementos <a> que tenham o atributo rel declarado com valor igual a galeria.

$(‘a[rel!=”galeria”]’) - Seleciona os elementos que tiverem o atributo declarado entre conchetes com valor diferente ao informado no seletor entre aspas, no caso seriam selecionados os elementos <a> que tenham o atributo rel declarado com valor diferente de galeria.

$(‘a[href^=”http://”]’) - Seleciona os elementos que tiverem o atributo declarado entre conchetes com valor iniciando com o valor informado no seletor entre aspas, no caso seriam selecionados os elementos <a> que tenham o atributo href declarado com valor iniciando em http://.

  • $(‘a[href$=”.rar”]’) - Seleciona os elementos que tiverem o atributo declarado entre conchetes com valor terminado com o valor informado no seletor entre aspas, no caso seriam selecionados os elementos <a> que tenham o atributo href declarado com valor terminando em .rar.
  • $(‘a[title*=”teste”]’) - Seleciona os elementos que tiverem o atributo declarado entre conchetes com ao menos uma ocorrência do valor informado no seletor entre aspas durante todo o valor do atributo, no caso seriam selecionados os elementos <a> que tenham no atributo title declarado ao menos uma ocorrência da palavra teste.

    Filtros para seletores-filho

  • $(‘div:first-child’) - seleciona o primeiro filho do elemento informado no seletor, no caso seria selecionado o primeiro elemento filho de todas as div’s da página.
  • $(‘div:last-child’) - seleciona o último filho do elemento informado no seletor, no caso seria selecionado o último elemento filho de todas as div’s da página.

  • $(‘div:only-child’) - seleciona o único filho do elemento informado no seletor, no caso seria selecionado o elemento filho da div que não possuir elementos irmãos, ou seja, seja o único filho do elemento <div>
  • $(‘ul:nth-child(indice/even/odd/equação)’) - seleciona o filho do elemento informado no seletor de acordo com o parâmetro informado entre chaves:

    • indice: um número inteiro que acessa o elemento filho com indice igual ao parametro. Ex.: 1, 2, etc.
    • even: seleciona os elementos filho com índice par, começando pelo zero. Ex.: 0, 2, 4, etc.
    • odd: seleciona os elementos filho com índice ímpar. Ex.: 1, 3, 5, etc.
    • equação: seleciona os elementos filho com índice gerado através de uma equação matemática.

    Nesse tutorial vimos os seletores de visibilidade, de atributo, e filtros para elementos filho. No próximo, e último, artigo da série vamos conhecer os seletores para formulários.

    Espero que tenham gostado, uma abraço e até a próxima.

    voltar