TADS:Estrutura de Dados: codigos2801

De Wiki Cursos IFPR Foz
Revisão de 00h08min de 5 de fevereiro de 2016 por Estevan.costa (discussão | contribs)
(dif) ← Edição anterior | Revisão atual (dif) | Versão posterior → (dif)
Ir para navegaçãoIr para pesquisar

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>