Selecionando elementos e exindo valores, parâmetros, características


Temos o seguinte código para teste.
<input type="text" placeholder="input 1" />
<input type="text" placeholder="input 2" />
<input type="text" placeholder="input 3" />


<div class="lista1">
    <div class="exemplo2">div 1 class=exemplo2</div>
    <div class="exemplo1">div 2 class=exemplo1</div>
    <div class="exemplo2">div 3 class=exemplo2</div>
</div>


<ul class="lista1">
    <li>opção 1-ul</li>
    <li class="exemplo2">opção 2-ul lista1 class=exemplo2</li>
    <li class="exemplo2">opção 3-ul lista1 class=exemplo2</li>
</ul>


<ul class="lista2">
    <li class="exemplo2">opção 1-ul lista2 class=exemplo2</li>
    <li class="exemplo2">opção 2-ul lista2 class=exemplo2</li>
    <li>opção 3-ul lista2 - sem classe</li>
</ul>


Importante nesse código notar que temos uma div com a classe lista1 e temos uma ul com a mesma classe.


Exibindo o código no browser fica assim (Nele será aplicado o jQuery):

div 1 class=exemplo2
div 2 class=exemplo1
div 3 class=exemplo2


Primeiro exemplo : selecionando um objeto :
Formato : $('div')


Segundo exemplo : Selecionando um objeto dentro de outro objeto.
Formato : $('div.exemplo1')


Terceiro exemplo : Agregando seletores para selecionar um item mais interno.
Exemplo : $('ul.lista1 .exemplo2')

Importante : ul é a tag, lista1 é a classe da ul, exemplo2 é a classe do li.


Quarto exemplo : Selecionando o primeiro elemento do seletor.
Formato : $('.lista1 .exemplo2:first')


Quinto exemplo : Selecionando o último elemento do seletor.
Formato : $('.lista1 .exemplo2:last')


Sexto exemplo : Selecionando os elementos pares do seletor.
Formato : ($('.lista1 .exemplo2:even')


Sétimo exemplo : Selecionando os elementos impares do seletor.
Formato : $('.lista1 .exemplo2:odd')