A sablon egy darab HTML, amelyet be kell vezetnie az oldalra. Gyakran a sablonokat „szerveroldalon” hozzák létre - abban az értelemben, hogy teljesen kialakított JavaScript-re érkeznek, és csak be kell őket helyezni a DOM-ba. De néha ez nem kivitelezhető, vagy további oda-vissza utat igényel a szerverhez, ami lassú lehet. Ebben az esetben a sablon közvetlenül a JavaScript-ben van. Minden bizonnyal egyszerűen elvégezhet egy kis karakterlánc-összefűzést, összeadva a HTML-fájlokat és az adatokat, amíg meg nem rendelkezik a szükséges sablonnal. De ez valószínűleg nem ideális, mivel nem választja el az adatok és a sablonok aggályait. A valódi JavaScript-sablonok itt segíthetnek.
Ebben a képernyõben a JavaScript sablonok „miért” alapértelmezését mutatjuk be, majd egy konkrét példát mutatunk be az Underscore.js fájlban. Akkor kitérünk néhány más alternatívára.
Demó
var compiled = _.template( " " + "" + "" + " " ); var i, toAppendString = ""; for (i = 0; i < data.movies.length; i++) ( toAppendString += compiled(data.movies(i)); ) $("body").append(toAppendString);Lásd: Chris Coyier (@chriscoyier) Pen% = penName%> a CodePen-en
Linkek
- Alapvető bemutató a CodePen-en
- Aláhúzás.js sablonozás
- NetTuts: A JavaScript-sablonok használatának legjobb gyakorlatai
- MDN: JavaScript sablonok
- John Resig: JavaScript mikrosablonozás
- James Padolsey: Egyenes felemelkedés