Шаблон JavaScript относится к клиентской стороне метод привязки данных, реализованный с помощью Язык JavaScript. Этот подход стал популярным благодаря более широкому использованию JavaScript, его расширенным возможностям обработки клиентов и тенденции передавать вычисления клиентскому веб-браузеру. Популярные библиотеки шаблонов JavaScript: AngularJS, Backbone.js, Ember.js, Handlebars.js, Vue.js и Mustache.js. Частой практикой является использование двойных фигурных скобок (т.е. {{key}}) для вызова значений заданного ключа из файлов данных, часто объектов JSON.
Во всех примерах используется внешний файл presnts.json
со следующим содержимым
{"президенты": [{"name": "Вашингтон", " имя ":" Джордж "," рожденный ":" 1732 "," смерть ":" 1799 "}, {" имя ":" Линкольн "," имя ":" Авраам "," рожденный ":" 1809 "," death ":" 1865 "}]}
Все примеры будут производить следующий HTML-список :
Библиотека | Код HTML | Пояснение |
---|---|---|
➊ Наши любимые президенты:
| ➊ Загрузите необходимые ресурсы, включая требуемый jQuery. ➋ HTML-код с пометкой атрибута | |
➊ Наши любимые президенты: | ➊ Загрузите необходимые библиотеки, здесь mustache.js и jQuery. ➋ HTML-код предоставляет «цель» для вставки сгенерированного содержимого.. ➌ Предоставьте шаблон с именем "президент-шаблон".. ➍ Последняя - это функция, которая собирает данные JSON и для каждого подэлемента президента захватывает один шаблон и заполняет его, чтобы, наконец, выбрать целевую HTML-страницу, добавив к ней целое. |
Создание шаблонов становится полезным, когда распространяемая информация может измениться, слишком велика, чтобы ее можно было поддерживать на различных HTML-страницах с помощью доступных человеческих ресурсов, и недостаточно велика, чтобы требовать более сложных шаблонов на стороне сервера.