Как я могу использовать буквенную разметку DOM в качестве шаблона прототипа? - PullRequest
Новая
       9

Как я могу использовать буквенную разметку DOM в качестве шаблона прототипа?

0 голосов
/ 01 августа 2009

Класс прототипа Шаблон позволяет легко подставлять значения в шаблон строки. Вместо того, чтобы объявлять исходную строку шаблона в моем коде, я хочу извлечь исходную строку из DOM.

Например, в моей разметке есть элемент: 

<div id="template1">
  <img src="#{src}" title="#{title}" />
</div>

Я хочу создать шаблон с внутренним содержимым элемента div, поэтому я попробовал что-то вроде этого: 

var template = new Template($('template1').innerHTML);

Проблема заключается в том, что представление InternetHerML'а innerHTML опускает кавычки вокруг значения атрибута, когда значение не имеет пробелов. Я также пытался использовать <a href="http://www.prototypejs.org/api/element/inspect" rel="nofollow noreferrer">Element#inspect</a>, но в Internet Explorer я получаю нерекурсивное представление элемента / поддерева.

Есть ли другой способ получить шаблонное представление содержимого поддерева?

Ответы [ 2 ]

2 голосов
/ 01 августа 2009

Похоже, что вы можете встроить источник шаблона в тег textarea вместо div и получить его, используя Element#value.

Конечно, делает разметку немного странной, но она все же кажется достаточно дружественной для дизайнеров.

Кроме того, как отметил Джейсон в комментарии к исходному вопросу, использование тега img в текстовой области предотвращает ложный запрос неверного изображения.

1 голос
/ 01 августа 2009

Resig на помощь:

Вы также можете встроить скрипт: 

<script type="text/html" id="user_tmpl">
  <% for ( var i = 0; i < users.length; i++ ) { %>
    <li><a href="<%=users[i].url%>"><%=users[i].name%></a></li>
  <% } %>
</script>

Быстрый совет: встраивание скриптов в ваш страница с неизвестным типом контента (так обстоит дело здесь - браузер не знает, как выполнить text / html script) просто игнорируются браузером - и поисковыми системами и скринридеры. Это идеальный устройство для маскировки шаблонов на вашу страницу. Мне нравится использовать это техника для быстрых и грязных дел где мне просто нужен маленький шаблон или два на странице и хотите что-то легкий и быстрый.

и вы будете использовать его из скрипта как так: 

var results = document.getElementById("results");
results.innerHTML = tmpl("item_tmpl", dataObject);
...