Revisão: Acesso DOM com jQuery

Para encontrar elementos DOM com jQuery, passe um seletor CSS válido into the jQuery function:

$("h1"); // seleciona todos os h1s
$("#heading"); // seleciona o elemento com id "heading"
$(".warning"); // seleciona todos os elementos com nome de classe "warning"

Observe que a função jQuery pode ser nomeada como $ ou jQuery, então isso é o mesmo que:

jQuery("h1");  
jQuery("#heading");  
jQuery(".warning");

Muitas pessoas preferem usar $ porque é mais curto.

A função jQuery sempre retorna uma coleção jQuery de elementos correspondentes, mesmo que haja apenas um elemento correspondente -- ou nenhum! Você pode ler mais sobre a função jQuery em sua documentação.

Quando você encontrar os elementos DOM com jQuery, você pode fazer coisas como definir seu conteúdo interno com text(): $("#temperature").text("89° Fahrenheit"); (Ver exemplo completo)

Você pode usar o mesmo método text() para obter o conteúdo interno, passando 0 parâmetro:
var heading = $("#heading").text();

No próximo tutorial, você vai aprender muitos outros métodos para obter e definir propriedades de elementos DOM.

Por trás das cenas, essas funções jQuery usam o API DOM que mostramos no curso HTML/JS . Por exemplo, a função $ utiliza métodos como getElementById() e querySelectorAll(); e attr() usa o método getAttribute(). Quando você utiliza a função $, você consegue usar essas funções com apenas algumas linhas, além de saber que seu código irá funcionar em todos os navegadores com suporte à jQuery, o que é importante quando estamos usando as mais recentes funções API DOM.

Quer participar da conversa?

Entrar

Classificar por:

Nenhuma postagem por enquanto.

Você entende inglês? Clique aqui para ver mais debates na versão em inglês do site da Khan Academy.