TADS:Desenvolvimento Web: codigos2801
De Wiki Cursos IFPR Foz
Este código possui as funcionalidades básicas do jQuery. Atenção para o código:
$(document).ready(function(){
.
.
.
});
que vincula uma *função anônima ao evento ready do documento. Assim, esta função irá executar assim que o documento estiver pronto. É necessário fazer esta vincualação, pois o jQuery precisa que os elementos já existam antes de executar seus códigos. Assim, esperar o documento ficar pronto garante que os elementos irão existir no momento da execução.
A estrutura de um comando jQuery sempre segue a estrutura $('seletor').ação(). O seletor será utilizado para ajudar o jQuery a escolher o elemento que será trabalhado. Vale salientar que as funções de CSS para criar seletores também se aplicam aqui. Para mais informações, acesse esta página da *W3Schools.
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
//$("*").hide();
$("p").hide();
$(".teste").hide();
$("#fera").hide();
$("#fera").click(function(){
$("#fera").hide();
});
$(".teste").click(function(){
$(".teste").hide();
});
$("p").click(function(){
$(this).hide();
});
$("#botao").click(function(){
$("*").show();
});
});
</script>
</head>
<body>
<input type="button" id="botao" value="mostrar">
<h1 class="teste"> Titulo</h1>
<h2 id="fera">Id Fera</h2>
<p>Primeiro</p>
<p>Segundo</p>
</body>
</html>
