Transferir como KEY, PPTX
![Arrays var x = [“zero”,“um”,“dois”]; x[2]; // dois x.length; // 3 x.reverse();](https://image.slidesharecdn.com/apresentacaomod2-110913125052-phpapp02/75/Javascript-jQuery-9-2048.jpg)
Carregado porGuilherme Vinicius Moreira
Javascript + jQuery
Este documento apresenta uma introdução ao Javascript e jQuery, incluindo: (1) Uma breve história do Javascript, (2) Como carregar o jQuery em uma página, (3) Como selecionar e manipular elementos DOM usando seletores jQuery e (3) Exemplos básicos de manipulação de estilo, animação e eventos.
Javascript + jQuery
- 1. Desenvolvimento Web: do básicoao deploy Módulo II - Javascript e jQuery
- 3.
- 4. Um slide dehistória 1995 vbscript mocha internet explorer netscape JAVASCRIPT https://developer.mozilla.org/en/JavaScript/Reference
- 5.
- 6.
- 7. Criar variáveis. var instrutor= “Harry”; var nota_aluno = 9.0; var odeia_windows = true; var idade = 22; Ponto e Vírgula no final !!!
- 8. Funções Globais alert(“Oi Sebastian!”); varanswer = confirm(“Ta na FATEC ?”); var age = prompt(“Sua idade:”);
- 9. Arrays var x =[“zero”,“um”,“dois”]; x[2]; // dois x.length; // 3 x.reverse();
- 10. Funções function nome (var1,var2) {}; function soma (num1, num2) { return num1 + num2; };
- 12. Carregando jQuery nasua página Por arquivo <script type="text/javascript" src="jquery.js"></script> Google CDN <script type="text/javascript" src= "https://ajax.googleapis.com/ajax/libs/ jquery/1.6.3/jquery.min.js"> </script> http://docs.jquery.com/Downloading_jQuery
- 13. DOM Document Object Model <html> <head> <title>Javascript Rules</title> </head> <body> <h1>Javascript é muito D+ !</h1> <p class=‘souracker’> Eu gosto de Javascript por que é hype! </p> <p id=‘noob’> Eu gosto de Javascript por causa do JAVA no nome. </p> </body> </html>
- 14. Seletores do jQuery Por nome de elemento $(“h1”); <h1>Javascript é muito D+ !</h1> <p class=‘souracker’> $(“p”); Eu gosto de Javascript por que é hype! </p> <p id=‘noob’> Eu gosto de Javascript por causa do JAVA no nome. </p>
- 15. Seletores do jQuery Por classe <p class=‘souracker’> $(“p.souracker”); Eu gosto de Javascript por que é hype! </p> CSS !!!! Elemento + . + nome da classe
- 16. Seletores do jQuery Por ID <p id=‘noob’> $(“p#noob”); Eu gosto de Javascript por causa do JAVA no nome. </p> CSS !!!! Elemento + # + nome do ID
- 17. Seletores do jQuery Espaço $(“p#noob”); é diferente de $(“p #noob”); $(“p#noob”); Seleciona o elemento p com ID “noob” $(“p #noob”); Seleciona qualquer elemento com ID “noob” dentro de p
- 18. Seletores do jQuery Múltiplos elementos $(“p#noob, p.souracker”);
- 19.
- 20. Visibilidade $(“p:first”).hide(); $(“p:first”).show(); $(“p:first”).toggle(); $(“p:first”).hide(“slow”); com animação! $(“p:first”).show(“fast”); $(“p:first”).toggle(“slow”);
- 21. Eventos $(“p”).click(); $(“p”).hover(); $(“p”).keypress(); Funções anônimas function(){ alert(“Não tenho nome!”); }
- 22.