CONTEÚDO PROGRAMÁTICO

Transcrição

1 CONTEÚDO PROGRAMÁTICO JQuery Completo Carga horária: 32 horas TreinaWeb Tecnologia LTDA CNPJ: / Av. Paulista, Conj 71 e 72 São Paulo - SP CONTEÚDO PROGRAMÁTICO Ementa do curso jquery Pré-requisitos Ambiente de trabalho Google Chrome NetBeans IDE Criando um projeto no NetBeans Histórico jquery e os Padrões Web Vantagens de trabalhar com jquery Quem usa o jquery Introdução JavaScript o pai do jquery Espaços, quebras de linha, comentários e ponto e vírgula opcional Variáveis, tipo de dados, conversão de tipos e aritmética Expressões, operadores e instruções Janelas e Alertas DOM Expressões Regulares Objetos, herança e protótipo Criando objetos Consultando e configurando objetos

2 API, framework ou biblioteca? API Vantagens: Framework Benefícios Bibliotecas Vantagens: Onde o jquery entra nisso tudo? DOM - Document Object Model Obtendo e inserindo o jquery na aplicação O primeiro exemplo com jquery Entendendo o exemplo A ordem dos fatores altera o produto Antes de usar, entenda! Usar a função $() ou jquery()? Seletores Seletor com XPath Seletores id e class Projeto final Parte I: O formulário Criando o HTML Inserindo o CSS O site do desenvolvedor é nosso amigo A documentação da API Quer plugins? Aqui é o lugar para procurar Aprender a selecionar é essencial Seletores Filtros Como usar tudo isso a meu favor? Manipulando a página web

3 Travessia jquery Criação de elementos na função jquery ($()).html().text().append().prepend().appendto().prependto().after().insertafter().before().insertbefore().wrap().unwrap().wrapall.wrapinner().remove().detach().replacewith().replaceall().empty().clone() Acessando e modificando CSS e atributos.attr().removeattr().prop().removeprop().addclass().removeclass()

4 .toggleclass().hasclass().val().data().removedata().css().offset().height().width().innerheight().innerwidth().outerheight().outerwidth() Afetando conjunto de resultados.map().each() O que você precisa saber sobre eventos Introdução Como fazer no jquery? E no JavaScript? IE8 e anteriores também podem? Adicionando manipuladores de eventos em múltiplos elementos Compreendendo o modelo de eventos do navegador Captura de eventos e borbulhamento A propagação de eventos Manipulação de eventos com jquery O arquivo de testes O objeto Event O construtor jquery.event

5 Propriedades de Event Métodos para anexar manipuladores de evento.bind() Eventos múltiplos Manipuladores de eventos O objeto Event.unbind() Valor retornado Usando namespaces Usando o objeto Event.on() Eventos diretos e delegados O manipulador de eventos e o seu ambiente Passando dados para o manipulador.off().delegate() Valor retornado

6 .undelegate() Valor retornado.one() Valor retornado.trigger() Valor retornado.triggerhandler().live().die() Métodos de evento de carregamento da página.ready()

7 .load().unload() Métodos para eventos de mouse.click().dblclick().focusout().hover().mousedown()

8 .mouseenter().mouseleave().mousemove().mouseout().mouseover().mouseup().toggle()

9 Exemplo prático Métodos para eventos de formulário.blur().change().focus().focusin().select().submit() Métodos para eventos de teclado.keydown()

10 .keypress().keyup() Métodos para eventos de navegador.error().resize().scroll() Projeto Final Parte II: Manipulando uma página Web Check-list de atividades Mudando a página inicial Atribuindo eventos aos elementos Animações e Efeitos Easings

11 .hide().show().toggle() para a primeira sintaxe para a segunda sintaxe.slidedown().slideup().slidetoggle().fadein()

12 .fadeout().fadeto().animate() para a primeira sintaxe para a segunda sintaxe.stop() para a primeira versão para a segunda versão Mais exemplos.queue() para a primeira sintaxe para a segunda sintaxe para a terceira sintaxe Valor de Retorno Mais exemplos

13 .dequeue() Valor retornado.clearqueue() Projeto final Parte III: Criando um banner e menus Criando o banner Criando o menu superior Criando uma página diferente Introdução a AJAX com jquery JSON Analisando JSON em JavaScript Recapitulando scripts HTTP Criando os arquivos para testes Instalando o XAMPP Criando o projeto no NetBeans IDE Usando XMLHttpRequest JSON Ajax com jquery Um exemplo prático Projeto final Parte IV: Atualizando o conteúdo com Ajax Criando o ambiente de testes Os arquivos HTML e CSS Inserindo o código jquery Introdução a Plugins Encontrando plugins e ajuda

14 Como usar um plugin Efetuando o download e inserindo a referência ao plugin Uso simples do plugin Especificando os parâmetros do plugin Introdução a jquery UI Baixando e inserindo jquery no código Navegando pelo site Exemplo Introdução ao jquery Mobile Simplicidade e flexibilidade gerais Aprimoramento progressivo e degradação suave Suporte para toque e outros métodos de entrada Acessibilidade Leve e modular Temas Suporte ao navegador Estrutura de uma página do jquery Mobile Páginas únicas, páginas múltiplas e vinculação de páginas Eventos e métodos suportados Eventos Inicializando o jquery Mobile Substituindo os valores padrão do jquery Mobile (PROTO) Métodos Widgets e atributos HTML5 data-* Diálogos listview Formulários Transições de página Temas e ThemeRoller

15 Introdução ao desenvolvimento de games com jquery Resumo do projeto Por que é importante aprender isso? Os objetivos Criando a estrutura de arquivos e pastas Criar o código HTML Criar um código wrapper para definição das variáveis Dividir uma imagem em pedaços Embaralhar as peças do quebra-cabeça Iniciar e parar o cronômetro Tornar as peças do quebra-cabeça arrastáveis Missão Cumprida Obtendo o máximo de jquery $() é o mesmo que jquery() Salvando seleções em variáveis Adicionar conteúdo o menor número de vezes possível Otimizando os Seletores Manipulação de DOM eficiente Use a versão mais recente, mas tenha atenção Sempre que possível não utilize o jquery Encadeamento de métodos? Sim, por favor! O que é o DRY (Don t Repeat Yourself)? Como medir a performance da sua aplicação? Já ouviu falar de Zepto? Por que gostar do Zepto Zepto não é perfeito, mas ainda vale a pena Compatibilidade Principais diferenças Explorando a API

16 Modificando o conteúdo HTML de um recipiente Anexar um elemento a um Contêiner Eventos AJAX Animações Considerações finais Conclusão Ficou alguma dúvida em relação ao conteúdo programático? Envie-nos um clicando aqui TreinaWeb