Sintaxe jQuery
Com jQuery você seleciona (consulta) elementos HTML e executa "ações" neles.
Sintaxe jQuery
A sintaxe do jQuery é feita sob medida para selecionar elementos HTML e realizar alguma ação no(s) elemento(s).
A sintaxe básica é: $( seletor ). ação ()
- Um sinal $ para definir/acessar jQuery
- A ( seletor ) para "consultar (ou localizar)" elementos HTML
- Uma ação jQuery () a ser executada no(s) elemento(s)
Exemplos:
$(this).hide() - oculta o elemento atual.
$("p").hide() - oculta todos os elementos <p>.
$(".test").hide() - oculta todos os elementos com class="test".
$("#test").hide() - oculta o elemento com id="test".
Você conhece os seletores CSS?
jQuery usa sintaxe CSS para selecionar elementos. Você aprenderá mais sobre a sintaxe do seletor no próximo capítulo deste tutorial.
Dica: Se você não conhece CSS, pode ler nosso Tutorial de CSS .
O Evento Documento Pronto
Você deve ter notado que todos os métodos jQuery em nossos exemplos estão dentro de um evento pronto para documento:
$(document).ready(function(){
// jQuery methods go here...
});
Isso é para evitar que qualquer código jQuery seja executado antes que o documento termine de carregar (está pronto).
É uma boa prática esperar que o documento esteja totalmente carregado e pronto antes de trabalhar com ele. Isso também permite que você tenha seu código JavaScript antes do corpo do seu documento, na seção head.
Aqui estão alguns exemplos de ações que podem falhar se os métodos forem executados antes que o documento seja totalmente carregado:
- Tentando ocultar um elemento que ainda não foi criado
- Tentando obter o tamanho de uma imagem que ainda não foi carregada
Dica: A equipe do jQuery também criou um método ainda mais curto para o evento document ready:
$(function(){
// jQuery methods go here...
});
Use a sintaxe de sua preferência. Achamos que o evento document ready é mais fácil de entender ao ler o código.