Jquery – Seleção de Elementos

Em Jquery, é muito mais fácil buscar um elemento dentro de sua página web do que utilizando puro javascript. Confira abaixo alguns exemplos de como fazer a seleção de um elemento.

$(‘p’)

Seleciona todos os elementos de tag p na página.

$(‘#texto’)
Seleciona todos os elementos dentro de tags com id=’texto’ dentro de sua página.

$(‘.texto’)
Seleciona todos os elementos dentro de tags com class=’texto’ dentro de sua página.

$(‘p, div’)

Seleciona, ao mesmo tempo, os elementos dentro de tags p e div em sua página.

$(‘p’, $( ‘#texto’))
Seleciona todos os elementos dentro da tag p, de sua página, que por sua vez, estão dentro de tags com ‘id=texto’. Ou seja, caso você tenha tags p dentro de uma div com id diferente de id=texto, por exemplo, estas tags não serão consideradas. O que acontece aqui é que estamos selecionando um elemento (p) dentro de um contexto ($(‘#texto’)).

$(‘p’, $( ‘.texto’))
Seleciona todos os elementos dentro da tag p, de sua página, que por sua vez, estão dentro de tags com ‘class =texto’. Ou seja, caso você tenha tags p dentro de uma div com class diferente de class =texto, por exemplo, estas tags não serão consideradas.

$(‘div p’)
Seleciona todos os elementos dentro da tag p, de sua página, que por sua vez, estão dentro de tags divs. Ou seja, seleciona todos os p que são descendentes de div.

$(‘div > span’)
Seleciona todos os spans que são filhos de div. Lembre-se que um elemento é filho de outro se, e somente se, ele é o próximo na cadeia de níveis. Se um elemento x está a dois níveis abaixo de y, y não é seu filho, e sim seu descendente. Um filho é um descendente, mas um descendente não é, necessariamente, um filho.

$(‘div + p’)
Seleciona o primeiro elemento, no caso a div e o elemento imediatamente posterior, no caso o p. Ou seja, nesse caso teríamos selecionado todos os elementos dentro da div e o p que estiver logo após a div.

$(‘div ~ p’)
Seleciona o primeiro elemento, no caso a div e todos os seus irmãos que são tags p. Ou seja, a div, tendo um elemento pai x qualquer, teria sido selecionada e todos os filhos de x, que são tags p , seriam selecionados também. Contudo, as tags p selecionadas, devem vir APÓS a tag div. Todos os “filhos mais novos” do pai x não serão considerados.

$(‘li:first’)
Seleciona o primeiro elemento li .

$(‘li:last’)
Seleciona o último elemento li .

$(‘li:not(li:last)’)
Seleciona todos os elementos li, exceto o último.

$(‘p:even’)
Seleciona as ocorrências pares do elemento p. Não se esqueça que a primeira ocorrência é considerada a ocorrência zero, ou seja, par.

$(‘p:odd’)
Seleciona as ocorrências ímpares do elemento p.

$(‘p:eq(3)’)
Seleciona a terceira ocorrência do elemento p.

$(‘p:gt(3)’)
Seleciona as ocorrências, após a terceira, do elemento p.

$(‘p:lt(3)’)
Seleciona as ocorrências, anteriores a terceira, do elemento p.

$(‘:header’)
Seleciona todos os headers, independente do nível.

$(‘p:contains(‘programas’)’)
Seleciona as ocorrências do elemento p que contenham o termo ‘programas’.

Leave a Reply

Your email address will not be published. Required fields are marked *