Okosnica.js - El Element

Trenutno znamo da su pogledi u Okosnica.js Oni rade s logikom kako prezentirati informacije strukturirane modelom, postavlja se pitanje kako to izražavamo u svojoj aplikaciji, ono što radimo je rad s elementima DOM stablo kako bismo ih mogli umetnuti Javascript različite sadržaje u našem predlošku.
Za postizanje ovih ciljeva imamo element "the" koji se odnosi na naziv DOM element s kojim smo identificirali svoj dio vida.
Što je"?
Ovaj je element središnja komponenta ili svojstvo našeg pogleda, budući da se poziva na DOM element da je obvezno da stavovi imaju. Korištenje prikaza "the" kao svojstvo s kojim sastavljamo sadržaj i koje će se zatim nastaviti umetati u DOM.
Postoje dva načina na koja možemo povezati a DOM element s prizorom, prvi stvara novu i dodaje je u DOM i drugi upućuje na postojeći unutar stranice.
Stvaranje novog elementaAko želimo stvoriti novi element, moramo koristiti svojstva: tagName, id i className, na ovaj će način okvir biti zadužen za stvaranje novog elementa za nas, a referenca na navedeni element bit će dostupna u nekretnina "the", u slučaju da napustimo tagName prazno prema zadanim postavkama bit će stvoreno kao div.
Pogledajmo sljedeći kod u kojem možemo cijeniti ono što smo do sada naučili:

 var TasksView = Backbone.View.extend ({tagName: 'ul', // je potrebno, ali ako ga ostavimo praznim, uzima se kao div className: 'spremnik', // nije obavezno, ali možemo dodijeliti više ID klasa: 'zadatak', // izborno}); var TasksView = novi TasksView (); console.log (tasksView .el); // ispisat će se

Kao što vidimo, pogled stvaramo na osnovni način proširujući ili nasljeđujući iz Okosnica.Prikaz, zatim sa spomenutim svojstvima dodjeljujemo im vrijednost, na kraju instanciramo i sa console.log () vidimo rezultat.
Na sljedećoj slici možemo ilustrirati kako to izgleda kod nas Chrome konzola:

Ovdje vidimo kako bismo mogli generirati element s oznakom

koje smo naveli u našem pogledu build.
Metoda SetElement
Ova se metoda koristi kada želimo primijeniti pogled na drugi DOM element koji već postoji, tada će stvoriti novu referencu $ the, koji neće biti pridružen izvornom elementu već će ukazati na novi, sve to ovisi o događaju koji zovemo.
Pogledajmo u sljedećem kodu kako to primjenjujemo:


 // Izrađujemo dva DOM elementa koji predstavljaju gumbe var button1 = $ (''); var button2 = $ (''); // Definiramo novi pogled var View = Backbone.View.extend ({događaji: {click: function (e) {console.log (view.el === e.target);}}}); // Kreiramo instancu pogleda i primjenjujemo je na element button1 // na button1 var view = new View ({el: button1}); // Sada primjenjujemo pogled na element button2 metodom setElement view.setElement (button2); button1.trigger ('klik'); button2.trigger ('klik'); 


Ovo bi trebalo vratiti pravu vrijednost kada izvršimo događaj na element button2 Budući da je prikaz promijenjen u njega, pogledajmo sliku koja se odnosi na gore objašnjeno kako bismo dovršili vodič:




Je li vam se svidio i pomogao ovaj vodič?Autor možete nagraditi pritiskom na ovaj gumb kako biste mu dali pozitivan bod