PROF. DANIELA PIRES. Aplicações para Web. Aplicações para Web - FMU Prof. Daniela Pires - PDF
PROF. DANIELA PIRES. Aplicações para Web. Aplicações para Web - FMU Prof. Daniela Pires
Download "PROF. DANIELA PIRES. Aplicações para Web. Aplicações para Web - FMU - 2012 - Prof. Daniela Pires"
Mirella Aires Gonçalves
1 PROF. DANIELA PIRES Aplicações para Web 1
2 *Oficialmente: *Uma biblioteca escrita em Javascript *Uma definição melhor: *jquery é uma Biblioteca JavaScript que simplifica a manipulação de um documento HTML de maneira rápida e concisa, serve para tratamento de eventos, movimentações, animações e interação Ajax 2
3 *jquery é designado para mudar a maneira pela qual escrevemos Javascript *Produtividade é o lema *Write less, do more. *Uma única sintaxe para os mais diversos browsers 3
4 jquery Dojo Scriptaculous Prototype 4
5 *jquerynão passa de um arquivo js *Basta baixa-lo de * Jquery.com *Inclua a biblioteca em qualquer página html * através da tag script Ex: * <script language= javascript src= <caminho do arquivo jquery> /> 5
6 *Programação tradicional window.onload= function(){ alert( bem vindo"); } *Problemas com esta codificação *O código js não executa enquanto todas as imagens não sejam carregadas, incluindo banners, etc... *Pode ser que o objeto document ainda não esteja instanciado quando o js iniciar sua execução 6
7 *Jquery padroniza o início de execução de código js através do evento ready. $(document).ready(function(){ // Escreva aqui seu código }); 7
8 *Todo código jquery está atrelado a um objeto da página. *Para escolher quais objetos serão utilizados, é preciso utilizar o seletor $ 8
9 *1º Exemplo: Selecionando todas as tags"p" de um documento e aplicando uma propriedade CSS $(document).ready(function(){ $("p").css("background", "#FFF"); }); 9
10 *2º Exemplo: Selecionando todos os elementos filho de um elemento paicom o script abaixo, selecionamos todos os elementos filho (<li>) de uma lista que esteja de esteja dentro da div #exemplo2, e aplicamos à elas uma propriedade CSS. $(document).ready(function(){ $("#exemplo2 > ulli").css("font-weight", "bold"); }); 10
11 *#id Pega os elementos pelo id. *Elemento Pega os elementos diretamente pelo nome da tag. *.class Pega os elementos pela classe que lhes foi definida. ** Pega todos os elementos da página incluindo o head, o body. *Seletor Múltiplo Pega diversos elementos, por classe, id, objeto ou como quiser. 11
12 *Pegando elemento com id idteste e inserindo algum conteudo $( #idteste ).html( Inserindo meu texto ); *Pegando os elementos inputs e inserindo value0 neles $( input ).val( 0 ); *Pega os elementos com a classe minhaclass e coloca uma borda colorida neles $(.minhaclass ).css( border, 1px solid#4d4d4d ); 12
13 *Pegar todos os elementos e deixá-los com a cor da fonte preta: $( * ).css( color, #000 ); *Pega todos os elementos div, e elementos input com a class inputclasse e coloca uma borda vermelha: $( div,input#inputclasse ).css( border, 1px solidred ); 13
15 <htmlxmlns="http://www.w3.org/1999/xhtml"> <head> <script language="javascript" src="jquery min.js"></script> <script language="javascript"> $("document").ready(function() { $("a").click(function(){ $("#mensagem").text("olá mundo com jquery!!!!"); }); }); </script> </head> <body> <a href="#">clique Aqui para escrever a mensagem</a> <br><br> <div id="mensagem"></div> </body> </html> 15
16 *Use o plugin validate *As regras são *Required * *Minlenght *e muitas outras.. *É possível implementar as suas próprias rotinas de validação 16
17 *Use o plugin mask edinput *Adicione as máscaras de acordo com sua necessidade *Ex:Telefone: (99) *CEP: *CPF:
18 *UI: *Biblioteca jquery responsável por sofisticações visuais *Principais recursos *Iterações *Widgets *efeitos 18
19 *Utilizar o widget datepicker *Utilizar a iteração animate 19
20 *Parâmetros *type: *cache: *url: *data: *success: *error: 20
JQuery. A Biblioteca do Programador JavaScript. Maurício Samy Silva. Novatec
JQuery A Biblioteca do Programador JavaScript Maurício Samy Silva Novatec capítulo 1 O que é jquery? Neste capítulo, faremos uma introdução à biblioteca jquery, relatando suas origens, finalidades e destinação.
Manual do Gestor de Templates Versão - Revisão 2 200.07.09 Índice Introdução... 3 2 O que muda com o Gestor de Templates... 3 3 Implicação da utilização do Gestor de Templates... 4 4 Lista de Funcionalidades...