Your SlideShare is downloading. ×
Javascript moderno
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Javascript moderno

1,661

Published on

Palestra sobre Javascript Moderno dada no WOB2012

Palestra sobre Javascript Moderno dada no WOB2012

Published in: Technology
4 Comments
5 Likes
Statistics
Notes
No Downloads
Views
Total Views
1,661
On Slideshare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
17
Comments
4
Likes
5
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Javascript ModernoJean Carlo Nascimento aka Suissa
  • 2. Links nosqlbr.com.br jquerybrasil.org frontendbrasil.com.br javascriptbrasil.com.br comoprogramarphp.com.br github.com/suissa about.me/suissa @osuissa
  • 3. Breve História do Javascript
  • 4. "JS had to look like Java only less so, beJava’s dumb kid brother or boy-hostagesidekick. Plus, I had to be done in tendays or something worse than JS wouldhave happened". Brendan Eich
  • 5. LiveScript
  • 6. Como selecionar um elemento?
  • 7. jQuery$(#container);
  • 8. Javascript Modernovar container = document.querySelector(#container);
  • 9. Javascript Velhovar container = document.getElementById(container);
  • 10. Como procurar lis?
  • 11. jQuery$(#container).find(li);
  • 12. Javascript Modernovar lis = document.querySelectorAll(#container li);
  • 13. Javascript Velhovar lis = document .getElementById(container) .getElementsByTagName(li);
  • 14. Trabalhando com classes
  • 15. jQuery$(#box).addClass(wrap);$(#box).removeClass(wrap);$(#box).toggleClass(wrap);
  • 16. Javascript Modernovar container = document.querySelector(#box);container.classList.add(wrap);container.classList.remove(wrap);container.classList.toggle(wrap);
  • 17. Javascript Velhovar box = document.getElementById(box),hasClass = function (el, cl) { var regex = new RegExp((?:s|^) + cl + (?:s|$)); return !!el.className.match(regex);},addClass = function (el, cl) { el.className += + cl;},removeClass = function (el, cl) { var regex = new RegExp((?:s|^) + cl + (?:s|$)); el.className = el.className.replace(regex, );},toggleClass = function (el, cl) { hasClass(el, cl) ? removeClass(el, cl) : addClass(el, cl);};addClass(box, wrap);removeClass(box, wrap);toggleClass(box, wrap);
  • 18. HTML5
  • 19. Node.js
  • 20. Node.js

×