Шаблонът е част от HTML, която трябва да инжектирате върху страницата. Често шаблоните се създават „от страна на сървъра“ - тъй като те идват в JavaScript напълно оформен и просто трябва да бъдат поставени в DOM. Но понякога това не е осъществимо или би изисквало допълнително връщане до сървъра, което може да е бавно. В този случай идеалното използване на шаблона е в JavaScript. Със сигурност можете просто да направите малко конкатенация на низове, като добавите заедно битове HTML и данни, докато получите шаблона, от който се нуждаете. Но това вероятно не е идеално, тъй като не разделя проблемите на данните и шаблона. Истинското JavaScript шаблониране може да помогне тук.
В този екран ще разгледаме основното „защо“ на JavaScript шаблонирането и след това ще разгледаме един прост пример за това как се прави в Underscore.js. След това ще разгледаме някои други алтернативи.
Демонстрация
var compiled = _.template( " " + "" + "" + " " ); var i, toAppendString = ""; for (i = 0; i < data.movies.length; i++) ( toAppendString += compiled(data.movies(i)); ) $("body").append(toAppendString);Вижте писалката% = penName%> от Chris Coyier (@chriscoyier) в CodePen
Връзки
- Основна демонстрация на CodePen
- Underscore.js Шаблониране
- NetTuts: Най-добри практики при работа с шаблони на JavaScript
- MDN: JavaScript шаблони
- Джон Резиг: Микро шаблониране на JavaScript
- Джеймс Падолси: Право вграждане