Upload
paulo-andrade
View
295
Download
3
Embed Size (px)
Citation preview
Seletores CSS Básicos suportados pelo jQuery
Selecionando pela Tag:
Seletor Descrição
* Coincide com qualquer elemento
E Coincide com todos os elementos de marca E
E F Coincide com todos os elementos com nome de marca F que sejam descendentes de E
E>F Coincide com todos os elementos com nome de marca F que sejam filhos diretos de E
E+F Coincide com todos os elemento E imediatamente precedidos pro qualquer irmão E
E~F Coincide com todos os elementos F precedidos por qualquer irmão E
E:has(F)Coincide com todos os elementos com nome de marca E que tenham pelo menos um descendente com nome de marca F
E.C Coincide com todos os elementos E com nome de classe C. Omitir o E é o mesmo que *.C
E#I Coincide com o elemento E com id I. Omitir o E é o mesmo que *#I.
E[A] Coincide com todos elementos E com atributo A de qualquer valor.
E[A=V] Coincide com todos os elementos E com atributo A cujo valor seja exatamente V
E[A^=V] Coincide com todos elementos E com atributo A cujo valor comece com V
E[A$=V] Coincide com todos os elementos E com atributo A cujo valor terminne com V
E[A*=V] Coincide com todos os elementos E com atributo A cujo valor contenha V.
Selecionando por posicionamento:
Seletor Descrição
:firstA primeira coincidência da pag. li a:first devolde o primeiro link também sob um item de listagem
:lastA última coincidência da página. li a:last devolve o último link também sob um item de listagem
:first-childO primeiro elemento filho. li:first-child devolve o primeiro item de cada listagem do documento
:last-child O último elemento filho. li:last-child devolve o último item de cada listagem.
:only-child Devolve todos elementos que não tenham irmãos
:nth-child O enésimo elmento filho. li:nth-child(2) devolve o segundo item de listagem de cada listagem
:nth-child(even|odd) Filhos pares ou ímpares. li:nth-child(even) devolvem os filhos pares de cada listagem.
:nth-child(Xn+Y)O enésimo elemento filho computado pela fórmula fornecida. Se Y é 0, ele pode ser omitido. li:nth-child(3n) devolve cada terceiro item, enquanto li:nth-child(5n+1) devolve o item depois de cada quinto elemento
:even e :oddElementos pares e ímpares coincidentes ao longo da pag. li:even devolvem cada item de listagem par
:eq(n) O enésimo elemento coincidente.
:lt(n) Elementos coincidentes antes (e excluindo-se) o enésimo elemento conicidente.
:gt(n) Elementos coincidentes depois (e excluindo-se) o enésimo elemento coincidente.
Seletores de Filtro Personalizados do jQuery
Seletor Descrição
:animated Seleciona elementos que estejam atualmento sob controle de animação.
:button Seleciona qualquer botão (input[type=submit], input[type=reset], input[type=button] ou button)
:checkbox Seleciona apenas elementos checkbox (input[type=checkbox])
:checked Seleciona apenas checkbox ou botões de radio que estejam marcados (suportado por CSS)
:contains(foo) Seleciona apenas elementos contendo o texto ‘foo’
:disabled Seleciona apenas elementos de formulário que estejam desabilitados na interface (suportado pelo CSS)
:enabled Seleciona apenas elementos de formulário que estejam habilitados na interface (suportado pelo CSS)
:file Seleciona todos elmentos de arquivo (input[type=file])
:header Seleciona apenas elementos que são cabeçalhos, por exemplo <h1> a <h6>
:hidden Seleciona apenas elementos que estão escondidos
:image Seleciona imagens de formulários (input[type=image])
:input Seleciona apenas elementos de formulários (input, selecionar, área de texto, botões)
:not(filter) Nega o filtro especificado. input:not(:checkbox) seleciona elementos inputs que não sejam checkbox
:parent Seleciona apenas elementos que tenham filhos (incluindo texto), mas não elementos vazios
:password Seleciona apenas elemento de senha (input[type=password])
:radio Seleciona apenas elementos de radio (input[type=radio])
:reset Seleciona botões de reiniciar (input[type=reset] ou button[type=reset])
:selected Seleciona elementos de opção que estão selecionados
:submit Seleciona botões de enviar (button[type=submit] ou input[type=submit])
:text Seleciona apenas elementos de texto (input[type=text])
:visible Seleciona apenas elementos que são visíveis
Muitos dos seletores são relacionados ao estado do elemento.
Pode-se selecionar os checkbox habilitados e marcados de maneira simples:
1 $('input:checkbox:checked:enabled')Os seletores de filtros atenuam um conjunto de elementos e os seletores de busca encontram alguma relação com elementos que já foram selecionados.
Seletores de filtro podem ser identificados pelo : ou [ . Dentro do filtro not só podem ser utilizados seletores de filtro.
Então:
1$('form input:not(:hidden)') //funciona perfeitamente. Seleciona apenas os inputs que estão habilitados
2$('form :not(input:hidden)') // Não funciona pois a sintaxe do filtro 'not' está incorreta