Tweet
Tweet

Slide 1

Slide 1 text

No content

Slide 2

Slide 2 text

Михаил Давыдов Разработчик JavaScript Шаблонизаторы

Slide 3

Slide 3 text

3 var parent = document.createElement('div'); for (var i = 0; i < 10; i++) { var item = document.createElement('div'); item.setAttribute('class', 'item'); item.appendChild(document.createTextNode('Pewpew')); parent.appendChild(item); } document.getElementById('container').appendChild(parent); Шаблоны на DOM методах

Slide 4

Slide 4 text

4 // ЛОЛШТО??? item.appendChild (document.createTextNode ('Pewpew'));

Slide 5

Slide 5 text

5 Короче никак??? //
Pewpew

Slide 6

Slide 6 text

6 var html = '
'; for (var i = 0; i < 10; i++) { html += '
Pewpew
'; } html += '
'; document.getElementById('container') .innerHTML = html; Шаблоны на строках

Slide 7

Slide 7 text

7 Ну вот - другое дело! .innerHTML = html; <3

Slide 8

Slide 8 text

8 Код и данные смешиваются с шаблонами. Можно ли иначе?

Slide 9

Slide 9 text

9 Шаблонизаторы FTW!

Slide 10

Slide 10 text

10
{{do n.times}}
Pewpew
{{/do}}
// Юзаем TemplateEngine.render(template, { n: 10 }) .appendTo('#container'); Шаблоны на шаблонах!

Slide 11

Slide 11 text

11 Красота!

Slide 12

Slide 12 text

12 Шаблонизаторы •  http://ejohn.org/blog/javascript-micro- templating/ •  http://api.jquery.com/jquery.tmpl/ •  http://mustache.github.com/mustache.5.html еще OVER 900 http://goo.gl/aoM8b

Slide 13

Slide 13 text

Все