Baixado 42 vezes
Carregado porTeles Maciel
Jquery - Apresentação e aplicação prática
O documento apresenta uma introdução ao framework jQuery: (1) Surgiu em 2005 com licença MIT ou GPL, (2) tem como objetivo simplificar o desenvolvimento front-end e a interação com o DOM, (3) possui uma vasta quantidade de plugins criados pela comunidade.
Jquery - Apresentação e aplicação prática
- 1. jQuery David R. Lopes J. Teles Maciel Jovan Ângelo Paulo A . França
- 2. Introdução Framework Javascript ;
- 3.
- 4. Licença: MIT ou GPL ;
- 5. Não é oúnico framework javascript; Tema: Write Less, Do More
- 6. Para que serve:Resolução da incompatibilidade entre os navegadores.
- 7.
- 8. Reutilização do códigoatravés de plugins.
- 9. Utilização de umavasta quantidade de plugins criados por outros desenvolvedores.
- 10. Trabalha com AJAX e DOM .
- 11. Implementação segura derecursos do CSS1 , CSS2 e CSS3 . Texto integralmente retirado de http://pt.wikipedia.org/wiki/JQuery
- 12. Quanto "pesa" umframework? O framework Jquery na sua versão 1.4 (minificado) pesa 24kb !
- 13. Para seu projetovocê pode baixar o Jquery em : www.jquery.com ou importar a biblioteca diretamente do Google, deste modo: <script src= " http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js " type= " text/javascript " ></script>
- 14. O que vocêprecisa saber pra começar? Você tem que ter o DOM (carregado) pra usar jQuery;
- 15. XHTML e Javascript ;
- 16. Seletores CSS2 e CSS3 (já são previstos no jQuery) podem te ajudar! jQuery é fácil: A biblioteca se baseia na chamada de apenas uma função e tem 24kb. Vamos por a mão na massa?
- 17. Esquentando com “Hello World” Baixe a mais nova versão do JQuery, atualmente 1.4.2;
- 18. Crie um arquivo teste.html;
- 19. Coloque o jquery-1.4.2.js no mesmo diretório do teste.html e importe a biblioteca;
- 20. Esquentando com “Hello World”
- 21. Esquentando com “Hello World”
- 22. Explicando o código$( "a" ) é um Selector do jQuery que seleciona elementos "a" O $ é como se assemelha a uma "classe" em jQuery $() portanto "instancia" um objeto jQuery .click() é invocado quando ocorre um click do mouse em um elemento selecionado; O código sem jQuery: Separação de JS e HTML ! Eliminação de código redundante! <3 jQuery.
- 23. Agora cumpriremos uma missão em jQuery
- 24. Baixamos o site fatecsjc.edu.br usando wget e iremos aplicar alterações nele via jQuery para que mais meninas se interessem por nossa faculdade: Eis o site baixado: Missão 1: Mudar o site da fatecsjc
- 25. Missão 1: Mudaro site da fatecsjc + = ... alteracoes .js
- 26. Missão cumprida. Vamosver o novo leiaute
- 27.
- 28.
- 29. Jquery é maisque manipulação do DOM Jquery tem diversas outras potencialidades: Ajax simplificado:
- 30. Métodos $.ajax, $.getJSON , $.get e etc...
- 31. Garantia de funcionarnos mais diversos navegadores;
- 32. Documentação extensa eatualizada;
- 33. Comunidade forte emuitos entusiastas;
- 34. Utilizado em muitossites famosos como Google Search, IBM.com , Mozzila.com , etc..;
- 35. Validação de formuláriosno cliente;
- 36. Muitos, muitos emuitos plugins.
- 37. Plugins ver jquerylist.com
- 38. Leitura recomendada Melhoreseu código jQuery (25 dicas) [EN]
- 39.
- 40. 08 plugins jQueryque usam apis da Google(EN):
- 41.
- 42. 31 snippets dejQuery (EN):
- 43.
- 44. Anatomia de umplugin jQuery
- 45.
- 46.
- 47.
- 48.
- 49.