O mică istorie
-
Până acum câțiva ani au existat mari diferențe între browsere:
-
bibliotecile au apărut să se ocupe de acest tip de lucru:
- JQuery (2005)
- Ce sa întâmplat de atunci, în 2010?
- Microsoft se apropie de standarde de la IE9 (2011)
- Utilizarea browserelor non-compatibile a scăzut.
- Există mai multe posibilități de la JavaScript pentru accesul duminicii.
- cadre ca unghi (din 2010) Utilizați JQLITE, o versiune foarte redusă a jquery
<
- React tip cadre (2013) Începeți să lucrați cu dom:
- Lucrul cu Sunda este scump, mai bine Lucrați cu o versiune „mai ușoară”
- Dacă se schimbă apar în Dom virtual, se deplasează la fac M Real
- JQUEY funcționează direct cu DOM, astfel încât acesta rămâne eficiență
folosim jQuery?
- Răspuns rapid: Nu, cu excepția subiectelor de compatibilitate
- Răspuns meditat:
- Dacă faceți o rețea (nu un webApp) dacă
- Aruncați mai multe pluginuri și evoluțiile deja realizate
- Dacă faceți un site web, nu utilizați un cadru JS, dar analizați:
- SEO? Timp de încărcare? Render pe server?
- Dacă faceți o rețea (nu un webApp) dacă
e-am obișnuit să folosim cât mai mult jQuery, care acum va învăța din nou:
- pentru a face lucruri cu JavaScript înainte de
- pentru a utiliza noi caracteristici JavaScript acum
Selector de clasă
// jQuery$('.myClass');// JavaScriptdocument.getElementsByClassName('myClass');
Selector de identificare
// jQuery$('#myID');// JavaScriptdocument.getElementById('myID');
Selector de etichetă
// jQuery$('div');// JavaScriptdocument.getElementsByTagName('div');
QuerySelector
// 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('');
JavaScript Evenimente
Evenimente
/* * Click */// jQuery$(elem).on('click', function () {...});// JavaScriptdocument.querySelector(elem).onclick = function () {...}
Evenimente Encorate
document.addEventListener('click', function() { // ...}, false);
DOM Ready Event
- Suport Majoritatea browserelor
document.addEventListener('DOMContentLoaded', function() { // DOM ready, run it!}, false);
0 Comments Leave a comment