IBM - Apresentando jQuery
Click here to load reader
-
Upload
alberto-leal -
Category
Documents
-
view
2.877 -
download
0
Transcript of IBM - Apresentando jQuery
jQuery“write less, do more”
http://www.estatuaslimitededition.com/dc-direct-f8/lancamento-dc-direct-two-face-busto-12-t1739.htm
Duas partes
#1
Um pouco de Javascript
Erros encontrados
Javascript Obstrusivo
Código não é cross-browser
Seu código precisa ser Cross-browser
Cross-browser
Se não encontrar “id”, busca por “name”! (IE6)
Cadê o “id”?
http://techgamesblog.com/happy-computer-shopping/
#2
jQuery
O que é?
An open source JavaScript library that simplifies the interaction between HTML and JavaScript.
IBM
MSNBC
AmazonAOL
Technorati
Drupal
Wordpress
DiggBBC
SourceForge Intuit
Salesforce
FeedBurner
WB Records
entre outros ...
Quem usa?
Por que jQuery?
•Events (click, hover, change..)
•DOM Manipulation (append, remove..)
•Effects (hide, show, fadeOut..)
•Ajax(load, get, post..)
Features
Como usar?
1º Encontre um elemento
2º Faça algo com ele
$(“#div”) $(“.class”)
$(“element”)
Seletores
Seletores$(“# mydiv, .class, element ”)
Métodos jQuery
Adicionando elementos:append(), before(), after()..
Atributos:css(), attr(), html(), val(), addClass()..
Eventos:bind(), trigger(), unbind(), click()..
Efeitos:show(), fadeOut(), toggle()..
DOM:find(), is(), prevAll(), next(), hasClass()..
Ajax:get(), post(), getJson(), load(), ajax()..
Métodos jQuery
Manipulando o DOMContexto
Métodos encadeados
Adiciona uma classe css ao div
Faz com que o div desapareça devagar
Efeitos(hide, show, fadeO ut, fadeIn..)
Ajax
Plugin
http://omundoemumajanela.blogspot.com/2010/09/lego.html
Don`t Repeat Yourself
Criando um plugin
$('p').myplugin();
Encontre todos os elementos “p” e aplique o “myplugin”.
jquery.myplugin.js
jQueryUI
Ferramentas para Testes
Teste Unitário
Ferramentas para TestesBDD
https://github.com/velesin/jasmine-jquery
Alguns livros…
Alguns links úteis
Obrigado!