Когда работаешь с JavaScript, то приходиться часто работать с DOM страницы. Есть задачи, когда нужно вставить в какой-то узел документа - кусочек готового шаблона с подстановкой в него данных. Самым простым вариантом будет склейка готового текста из кусочков, например:
var classname = "myclass";
var value = "test";
var content = "
"+value+"
"+"";
$("#div_id").append(content);
Но это не совсем удобно, особенно если "склеивать" большое количество частей. jQuery 1.6.x предлагает свой шаблонизатор, но он пока в бета-версии. Есть куча сторонних решений, но они, как правило, громоздкие и надо всегда оценивать целесообразность их применения. Когда-то нашел интересный пример реализации шаблонизатора, который и покажу в действии.
Расширяем стандартный класс
String:
String.prototype.supplant = function(o) {
return this.replace(/\{([^{}]*)\}/g, function(a, b) {
var r = o[b];
return typeof r === 'string' || typeof r === 'number' ? r : a;
});
};
Пример его использования:
var template = "
{value}
";
var content = template.supplant({classname: 'myclass', value: 'test'});
Такой подход позволяет держать шаблоны вставки отдельно от логики скрипта, что позволяет удобно править верстку без правки логики.
Такой шаблон сохраняется один раз и используется для всего приложения, что также исключает повторную реализацию одинакового кода. Операция замены ключей шаблона значениями входящего объекта не является ресурсоемкой.