SlideShare une entreprise Scribd logo
1  sur  19
Télécharger pour lire hors ligne
javascript
 aplicado
client-side
html + css + js + others
execução no browser
dependência do browser
 adaptação ao browser
ex1
    alert
   chrome
documentação
ex1
anatomia de uma página web
         <html />
         <link />
        <script />
ex1
onobtrusive javascript
         vs.
 practical javascript
ex2
truques de validação
   de formulários
ex2
js + html: a evitar...
   ...mas dá jeito.
ex2
 links, botões
e o return value
ex3
dados externos
xmlhttprequest
ex3
json vs. xml
ex4
        jQuery
write less do more...
ex4
       jQuery
...and a bit slower
ex5
jQuery e os selectores css
ex5
eventos em jQuery
ardina
um cliente RSS em html
ardina
  prototype ftw
oop em javascript
dicas
     copy é bom, paste é mau
  msdn http://msdn.microsoft.com/en-us/library/aa155073.aspx
mozilla docs https://developer.mozilla.org/es/JavaScript
obrigado.
     nuno simaria
    nsimaria@ua.pt
      @_nsimaria_

software is modern art.

Contenu connexe

Tendances

PhantomJS - O Fantasminha Camarada
PhantomJS - O Fantasminha CamaradaPhantomJS - O Fantasminha Camarada
PhantomJS - O Fantasminha CamaradaHenrique Gogó
 
Curso de Node.js e MongoDB - 06
Curso de Node.js e MongoDB - 06Curso de Node.js e MongoDB - 06
Curso de Node.js e MongoDB - 06Luiz Duarte
 
Dividindo responsabilidades com VRaptor, Rest, HTML5 e CSS3
Dividindo responsabilidades com VRaptor, Rest, HTML5 e CSS3Dividindo responsabilidades com VRaptor, Rest, HTML5 e CSS3
Dividindo responsabilidades com VRaptor, Rest, HTML5 e CSS3André Luiz Forchesatto
 
Introdução JavaScript e DOM
Introdução JavaScript e DOMIntrodução JavaScript e DOM
Introdução JavaScript e DOMRomualdo Andre
 
T03_LM3: Javascript (2013-2014)
T03_LM3: Javascript (2013-2014)T03_LM3: Javascript (2013-2014)
T03_LM3: Javascript (2013-2014)Carlos Santos
 
Como tratar múltiplos JSONps com o mesmo callback name? - FloripaJS
Como tratar múltiplos JSONps com o mesmo callback name? - FloripaJSComo tratar múltiplos JSONps com o mesmo callback name? - FloripaJS
Como tratar múltiplos JSONps com o mesmo callback name? - FloripaJSVinicius Kiatkoski Neves
 
Aula Introdução a VRaptor 4 - Pós Java UTFPR
Aula Introdução a VRaptor 4 - Pós Java UTFPRAula Introdução a VRaptor 4 - Pós Java UTFPR
Aula Introdução a VRaptor 4 - Pós Java UTFPRAndré Luiz Forchesatto
 
Nodejs Intro William Dias
Nodejs Intro William DiasNodejs Intro William Dias
Nodejs Intro William DiasWilliam Dias
 
Javascript
JavascriptJavascript
Javascriptwlsilva
 
Node.js: 5 razões para começar a utilizar
Node.js: 5 razões para começar a utilizarNode.js: 5 razões para começar a utilizar
Node.js: 5 razões para começar a utilizarFilipe Falcão
 
Introdução JavaScript e DOM 2016
Introdução JavaScript e DOM 2016Introdução JavaScript e DOM 2016
Introdução JavaScript e DOM 2016Romualdo Andre
 
LabMM3 - Aula teórica 04
LabMM3 - Aula teórica 04LabMM3 - Aula teórica 04
LabMM3 - Aula teórica 04Carlos Santos
 
DOMinando JavaScript
DOMinando JavaScriptDOMinando JavaScript
DOMinando JavaScriptThiago Poiani
 

Tendances (19)

PhantomJS - O Fantasminha Camarada
PhantomJS - O Fantasminha CamaradaPhantomJS - O Fantasminha Camarada
PhantomJS - O Fantasminha Camarada
 
Curso de Node.js e MongoDB - 06
Curso de Node.js e MongoDB - 06Curso de Node.js e MongoDB - 06
Curso de Node.js e MongoDB - 06
 
Dividindo responsabilidades com VRaptor, Rest, HTML5 e CSS3
Dividindo responsabilidades com VRaptor, Rest, HTML5 e CSS3Dividindo responsabilidades com VRaptor, Rest, HTML5 e CSS3
Dividindo responsabilidades com VRaptor, Rest, HTML5 e CSS3
 
Codelab: TypeScript
Codelab: TypeScriptCodelab: TypeScript
Codelab: TypeScript
 
Introdução JavaScript e DOM
Introdução JavaScript e DOMIntrodução JavaScript e DOM
Introdução JavaScript e DOM
 
Node.js
Node.jsNode.js
Node.js
 
T03_LM3: Javascript (2013-2014)
T03_LM3: Javascript (2013-2014)T03_LM3: Javascript (2013-2014)
T03_LM3: Javascript (2013-2014)
 
Como tratar múltiplos JSONps com o mesmo callback name? - FloripaJS
Como tratar múltiplos JSONps com o mesmo callback name? - FloripaJSComo tratar múltiplos JSONps com o mesmo callback name? - FloripaJS
Como tratar múltiplos JSONps com o mesmo callback name? - FloripaJS
 
Aula Introdução a VRaptor 4 - Pós Java UTFPR
Aula Introdução a VRaptor 4 - Pós Java UTFPRAula Introdução a VRaptor 4 - Pós Java UTFPR
Aula Introdução a VRaptor 4 - Pós Java UTFPR
 
Nodejs Intro William Dias
Nodejs Intro William DiasNodejs Intro William Dias
Nodejs Intro William Dias
 
Javascript nos dias de hoje
Javascript nos dias de hojeJavascript nos dias de hoje
Javascript nos dias de hoje
 
Conhecendo mundo Node.js
Conhecendo mundo Node.jsConhecendo mundo Node.js
Conhecendo mundo Node.js
 
Javascript
JavascriptJavascript
Javascript
 
Node.js: 5 razões para começar a utilizar
Node.js: 5 razões para começar a utilizarNode.js: 5 razões para começar a utilizar
Node.js: 5 razões para começar a utilizar
 
Introdução JavaScript e DOM 2016
Introdução JavaScript e DOM 2016Introdução JavaScript e DOM 2016
Introdução JavaScript e DOM 2016
 
Apresentação
ApresentaçãoApresentação
Apresentação
 
LabMM3 - Aula teórica 04
LabMM3 - Aula teórica 04LabMM3 - Aula teórica 04
LabMM3 - Aula teórica 04
 
DOMinando JavaScript
DOMinando JavaScriptDOMinando JavaScript
DOMinando JavaScript
 
Por que Node JS?
Por que Node JS?Por que Node JS?
Por que Node JS?
 

En vedette

Academia Verão 2011 - HTML
Academia Verão 2011 - HTMLAcademia Verão 2011 - HTML
Academia Verão 2011 - HTMLNuno Simaria
 
Internet - Como funciona - Academia de Verão UA
Internet - Como funciona - Academia de Verão UAInternet - Como funciona - Academia de Verão UA
Internet - Como funciona - Academia de Verão UANuno Simaria
 
Sce javascript framework first peek
Sce javascript framework first peekSce javascript framework first peek
Sce javascript framework first peekNuno Simaria
 
Academia verao 2011 - HTML + CSS
Academia verao 2011 - HTML + CSSAcademia verao 2011 - HTML + CSS
Academia verao 2011 - HTML + CSSNuno Simaria
 
Learn BEM: CSS Naming Convention
Learn BEM: CSS Naming ConventionLearn BEM: CSS Naming Convention
Learn BEM: CSS Naming ConventionIn a Rocket
 
Lightning Talk #9: How UX and Data Storytelling Can Shape Policy by Mika Aldaba
Lightning Talk #9: How UX and Data Storytelling Can Shape Policy by Mika AldabaLightning Talk #9: How UX and Data Storytelling Can Shape Policy by Mika Aldaba
Lightning Talk #9: How UX and Data Storytelling Can Shape Policy by Mika Aldabaux singapore
 
The Outcome Economy
The Outcome EconomyThe Outcome Economy
The Outcome EconomyHelge Tennø
 

En vedette (9)

Academia Verão 2011 - HTML
Academia Verão 2011 - HTMLAcademia Verão 2011 - HTML
Academia Verão 2011 - HTML
 
Internet - Como funciona - Academia de Verão UA
Internet - Como funciona - Academia de Verão UAInternet - Como funciona - Academia de Verão UA
Internet - Como funciona - Academia de Verão UA
 
NoSQL
NoSQLNoSQL
NoSQL
 
Sce javascript framework first peek
Sce javascript framework first peekSce javascript framework first peek
Sce javascript framework first peek
 
Academia verao 2011 - HTML + CSS
Academia verao 2011 - HTML + CSSAcademia verao 2011 - HTML + CSS
Academia verao 2011 - HTML + CSS
 
Learn BEM: CSS Naming Convention
Learn BEM: CSS Naming ConventionLearn BEM: CSS Naming Convention
Learn BEM: CSS Naming Convention
 
Lightning Talk #9: How UX and Data Storytelling Can Shape Policy by Mika Aldaba
Lightning Talk #9: How UX and Data Storytelling Can Shape Policy by Mika AldabaLightning Talk #9: How UX and Data Storytelling Can Shape Policy by Mika Aldaba
Lightning Talk #9: How UX and Data Storytelling Can Shape Policy by Mika Aldaba
 
Succession “Losers”: What Happens to Executives Passed Over for the CEO Job?
Succession “Losers”: What Happens to Executives Passed Over for the CEO Job? Succession “Losers”: What Happens to Executives Passed Over for the CEO Job?
Succession “Losers”: What Happens to Executives Passed Over for the CEO Job?
 
The Outcome Economy
The Outcome EconomyThe Outcome Economy
The Outcome Economy
 

Similaire à JavaScript aplicado: client-side, browser, validação, jQuery e mais

Ferramenta Flow - Análise estática de códigos javascript
Ferramenta Flow - Análise estática de códigos javascriptFerramenta Flow - Análise estática de códigos javascript
Ferramenta Flow - Análise estática de códigos javascriptRodrigo Ferreira
 
Implementando MVC com AJAX
Implementando MVC com AJAXImplementando MVC com AJAX
Implementando MVC com AJAXcejug
 
Minicurso Ajax - 5. Semana de Informática PUC Minas São Gabriel
Minicurso Ajax - 5. Semana de Informática PUC Minas São GabrielMinicurso Ajax - 5. Semana de Informática PUC Minas São Gabriel
Minicurso Ajax - 5. Semana de Informática PUC Minas São GabrielMarcelo Linhares
 
Bypass de token csrf na pratica secure brasil
Bypass de token csrf na pratica secure brasilBypass de token csrf na pratica secure brasil
Bypass de token csrf na pratica secure brasilWilliam Costa
 
Minicurso de JavaScript (Portuguese)
Minicurso de JavaScript (Portuguese)Minicurso de JavaScript (Portuguese)
Minicurso de JavaScript (Portuguese)Bruno Grange
 
performance em jQuery apps
performance em jQuery appsperformance em jQuery apps
performance em jQuery appsDavidson Fellipe
 
Performance - Acelere seu site! Na web tempo é mais que dinheiro.
Performance - Acelere seu site! Na web tempo é mais que dinheiro.Performance - Acelere seu site! Na web tempo é mais que dinheiro.
Performance - Acelere seu site! Na web tempo é mais que dinheiro.Gustavo Corrêa Alves
 
Coisas que aprendi e quero passar adiante - RubyConf Brasil 2010
Coisas que aprendi e quero passar adiante - RubyConf Brasil 2010Coisas que aprendi e quero passar adiante - RubyConf Brasil 2010
Coisas que aprendi e quero passar adiante - RubyConf Brasil 2010lucashungaro
 
Tutorial visão automação de testes e casper js
Tutorial visão automação de testes e casper jsTutorial visão automação de testes e casper js
Tutorial visão automação de testes e casper js4ALL Tests
 
Tutorial - Visão sobre Automação de Testes com CasperJS
Tutorial - Visão sobre Automação de Testes com CasperJSTutorial - Visão sobre Automação de Testes com CasperJS
Tutorial - Visão sobre Automação de Testes com CasperJSFrederico Allan
 
Surpreenda-se com o Silverlight 3
Surpreenda-se com o Silverlight 3Surpreenda-se com o Silverlight 3
Surpreenda-se com o Silverlight 3Rodrigo Kono
 
Primeiros passos com o framework Sencha Ext JS
Primeiros passos com o framework Sencha Ext JSPrimeiros passos com o framework Sencha Ext JS
Primeiros passos com o framework Sencha Ext JSWemerson Januario
 
Desenvolvimento para Windows 8 com Javascript
Desenvolvimento para Windows 8 com JavascriptDesenvolvimento para Windows 8 com Javascript
Desenvolvimento para Windows 8 com JavascriptEduardo Costa
 
(A04 e A05) LabMM3 - JavaScript
(A04 e A05) LabMM3 - JavaScript(A04 e A05) LabMM3 - JavaScript
(A04 e A05) LabMM3 - JavaScriptCarlos Santos
 
Desenvolvimento Front end (AngularJS e Bootstrap)
Desenvolvimento Front end (AngularJS e Bootstrap)Desenvolvimento Front end (AngularJS e Bootstrap)
Desenvolvimento Front end (AngularJS e Bootstrap)Julian Cesar
 
Microsoft Edge (Teched 2015)
Microsoft Edge (Teched 2015)Microsoft Edge (Teched 2015)
Microsoft Edge (Teched 2015)Fabrício Catae
 

Similaire à JavaScript aplicado: client-side, browser, validação, jQuery e mais (20)

Ferramenta Flow - Análise estática de códigos javascript
Ferramenta Flow - Análise estática de códigos javascriptFerramenta Flow - Análise estática de códigos javascript
Ferramenta Flow - Análise estática de códigos javascript
 
Implementando MVC com AJAX
Implementando MVC com AJAXImplementando MVC com AJAX
Implementando MVC com AJAX
 
Minicurso Ajax - 5. Semana de Informática PUC Minas São Gabriel
Minicurso Ajax - 5. Semana de Informática PUC Minas São GabrielMinicurso Ajax - 5. Semana de Informática PUC Minas São Gabriel
Minicurso Ajax - 5. Semana de Informática PUC Minas São Gabriel
 
Bypass de token csrf na pratica secure brasil
Bypass de token csrf na pratica secure brasilBypass de token csrf na pratica secure brasil
Bypass de token csrf na pratica secure brasil
 
Minicurso de JavaScript (Portuguese)
Minicurso de JavaScript (Portuguese)Minicurso de JavaScript (Portuguese)
Minicurso de JavaScript (Portuguese)
 
performance em jQuery apps
performance em jQuery appsperformance em jQuery apps
performance em jQuery apps
 
Performance - Acelere seu site! Na web tempo é mais que dinheiro.
Performance - Acelere seu site! Na web tempo é mais que dinheiro.Performance - Acelere seu site! Na web tempo é mais que dinheiro.
Performance - Acelere seu site! Na web tempo é mais que dinheiro.
 
Coisas que aprendi e quero passar adiante - RubyConf Brasil 2010
Coisas que aprendi e quero passar adiante - RubyConf Brasil 2010Coisas que aprendi e quero passar adiante - RubyConf Brasil 2010
Coisas que aprendi e quero passar adiante - RubyConf Brasil 2010
 
Tutorial visão automação de testes e casper js
Tutorial visão automação de testes e casper jsTutorial visão automação de testes e casper js
Tutorial visão automação de testes e casper js
 
Tutorial - Visão sobre Automação de Testes com CasperJS
Tutorial - Visão sobre Automação de Testes com CasperJSTutorial - Visão sobre Automação de Testes com CasperJS
Tutorial - Visão sobre Automação de Testes com CasperJS
 
Surpreenda-se com o Silverlight 3
Surpreenda-se com o Silverlight 3Surpreenda-se com o Silverlight 3
Surpreenda-se com o Silverlight 3
 
Primeiros passos com o framework Sencha Ext JS
Primeiros passos com o framework Sencha Ext JSPrimeiros passos com o framework Sencha Ext JS
Primeiros passos com o framework Sencha Ext JS
 
Talk at QConSP
Talk at QConSPTalk at QConSP
Talk at QConSP
 
Desenvolvimento para Windows 8 com Javascript
Desenvolvimento para Windows 8 com JavascriptDesenvolvimento para Windows 8 com Javascript
Desenvolvimento para Windows 8 com Javascript
 
(A04 e A05) LabMM3 - JavaScript
(A04 e A05) LabMM3 - JavaScript(A04 e A05) LabMM3 - JavaScript
(A04 e A05) LabMM3 - JavaScript
 
Phonegap
PhonegapPhonegap
Phonegap
 
HTML5
HTML5HTML5
HTML5
 
Desenvolvimento Front end (AngularJS e Bootstrap)
Desenvolvimento Front end (AngularJS e Bootstrap)Desenvolvimento Front end (AngularJS e Bootstrap)
Desenvolvimento Front end (AngularJS e Bootstrap)
 
Microsoft Edge (Teched 2015)
Microsoft Edge (Teched 2015)Microsoft Edge (Teched 2015)
Microsoft Edge (Teched 2015)
 
Javascript Cross-browser
Javascript Cross-browserJavascript Cross-browser
Javascript Cross-browser
 

JavaScript aplicado: client-side, browser, validação, jQuery e mais