Создание модульного приложения
Есть html куски, которые должны грузится в зависимости от определенных условий. Можно подгружать js скрипты в которых будет что-то подобное:
document.getElementById(CONTAINER_ID).innerHTML = "<div>...</div>"; Но html слишком большие, и редактировать их не удобно. Есть ли способ загружать html(или что-либо ещё) файлы и встраивать их динамично? Надеюсь понятно объяснил :) |
Насчёт html: читайте про ajax.
А насчёт файлов: не представляю о каких файлах идёт речь |
Спасибо. Нашел здесь: http://stackoverflow.com/questions/5...l-js-with-ajax
Необходимо было следующее:
$.ajax({ url: 'http://aaa.ru/bbb.html', success: function(html){
$('#container').html(html);
}
|
Первый вариант ajax-ом
Второй вариант с тегом <script>
...
<body>
<div id="home"></div>
<script type="text/html" id="template_1">
//тут верстка
</script>
<script type="text/html" id="template_2">
//тут верстка
</script>
...
</body>
А с помощью скриптов делаешь следущее:
var template = $('#template_1').html(); // естественно id динамически определяются и подставляются.
$('#home').append(template);
|
ASerputko,
А какие преимущества в этом методе? Мне кажется тут одни недостатки. Заместо script уж лучше поставить скрытый div и просто по требованию его показывать. |
это лишний html.
а вот от jquery я бы посоветовал отказаться, если, конечно, она используется несколько шире, чем совершение ajax-запроса. |
Цитата:
|
Skipp,
Если открыть-закрыть картинку (какойнить блок с инфой), то да достаточно будет и спрятаных дивов. Но я предлагаю хранить там шаблоны, с переменными, форычами и т.д. + такой подход легко интегрируется в оффлайн приложение =) ну к примеру
...
<script type="text/html" id="template_2">
<div><%= title %></div>
<% _.each(news, function (item) { %>
<div><%= item %></div>
<% }); %>
</script>
...
var data = {
title : 'Last News!!!',
news : [...] //тут перечень новостей...
}
var template = _.template($('#template_2').html());
$('#home').append(template(data))
|
ASerputko,
По моему это извращение, есть более простые и не менее красивые способы. В данном случаи человеку приходиться придумывать свою разметку, что после, допустим через пол года, будет не так просто вспомнить и я считаю это минусом номер один. Не вижу смысла делать разметку в разметке. И кстати, вы так и не сказали почему именно в script, так как тоже самое можно практически в любом другом элементе сделать. |
Skipp,
1. script - скрывает содержимое внутри. 2. Область видимости id-шников, классов, тегов,...
...
<body>
<div id="container"></div>
<!--Templates -->
<script type="text/html" id="template_1">
<div id=container><%= context %></div>
</script>
<script type="text/html" id="template_2">
<div id=container><%= context %></div>
</script>
...
</body>
Если в загруженом html документе обратиться к id 'container', то будет доступ только к первому, который не обернут тегом <script> |
| Часовой пояс GMT +3, время: 04:42. |