Goodbye jQuery? (Galego)


un pouco de historia

  • Ata hai uns anos houbo grandes diferenzas entre navegadores:

    • Acceso á DOM
    • Xestionar eventos
  • As bibliotecas apareceron para tratar con este tipo de cousas:

    • jQuery (2005)
    • mootols (2007)
    • ….
  • Que pasou desde entón, poñer o 2010?
    • Microsoft estivo achegando os estándares de IE9 (2011)
    • O uso de navegadores non compatibles diminuíu.
    • Hai máis posibilidades de JavaScript para o acceso ao domingo.
    • Frameworks como ángulo (desde 2010) Use jqlite, unha versión moi reducida de jQuery
  • React Type Frameworks (2013) Comezar a traballar con DOM virtual:
    • Traballar co Sunda é caro, mellor traballar cunha versión “máis lixeiro”
    • se cambia ocorren no DOM virtual, pasan ao facer M real
    • jquey traballa directamente co DOM, polo que segue sendo a eficiencia

usamos jQuery?

  • Resposta rápida: non, agás os temas de compatibilidade
  • Resposta meditada:
    • Se fai unha web (non unha webApp) Se
      • dispor de moitos complementos E os desenvolvementos xa fabricados
    • Se fai un sitio web, non use un marco JS, pero analice:
      • SEO? Tempo de carga? Render no servidor?
      • Compoñentes que necesitas?

Selectores de JavaScript

  • Acostumamos a usar tanto jQuery que agora vai aprender de novo:
    • para facer cousas con Javascript antes de
    • para usar as novas funcións de JavaScript agora
  • Se é o noso caso, procedemos dun fondo de jQuery, vale a pena ter un ollo nunha guía.

Selector de clase

// jQuery$('.myClass');// JavaScriptdocument.getElementsByClassName('myClass');

selector de identificación

// jQuery$('#myID');// JavaScriptdocument.getElementById('myID');

selector de etiqueta

// jQuery$('div');// JavaScriptdocument.getElementsByTagName('div');

consultadelector

// Grab the first .myClass class namedocument.querySelector('.myClass');// Return a NodeList of all instances of .myClassdocument.querySelectorAll('.myClass');// Grab the myID iddocument.querySelector('#myID');// Return a NodeList of all 'div' instancesdocument.querySelectorAll('div');// Grab the last list Node of .someList unordered listdocument.querySelector('ul.someList li:last-child');// Grab some data-* attributedocument.querySelectorAll('');

eventos javascript

eventos

/* * Click */// jQuery$(elem).on('click', function () {...});// JavaScriptdocument.querySelector(elem).onclick = function () {...}

Eventos de Encorate

document.addEventListener('click', function() { // ...}, false);

DOM READY EVENT

  • Soporte sobre os navegadores
    document.addEventListener('DOMContentLoaded', function() { // DOM ready, run it!}, false);

Leave a Comment

O teu enderezo electrónico non se publicará Os campos obrigatorios están marcados con *