Javascript moderno

  • 1,578 views
Uploaded on

Palestra sobre Javascript Moderno dada no WOB2012

Palestra sobre Javascript Moderno dada no WOB2012

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
No Downloads

Views

Total Views
1,578
On Slideshare
0
From Embeds
0
Number of Embeds
3

Actions

Shares
Downloads
16
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