2009-12-28 3 views
1

Очень простой вопрос: я кодирую веб-приложение, которое содержит несколько страниц. Эти страницы имеют обычные общие элементы: например, заголовок/мачта сайта и боковая панель присутствуют на всех страницах. HTML статичный (не динамически генерируемый, его «ajaxy-ness» делается на стороне клиента).Лучшая практика для работы с общими «структурными» элементами страниц?

Каков наилучший способ импорта/«включая» эти общие элементы на мои страницы? Решение я использую, чтобы иметь в HTML-файлы содержат пустые места держателей

<div id="header"></div> 
<div id="leftSideBar"></div> 
(...) 

, а затем сделать в Jquery в $ (документ) .ready():

$.get("header.html", function(html) { $("#header").html(html); }); 
// .... 

Это лучший способ сделай это? Я новичок в веб-разработке. :)

Я думаю, что я мог бы также выкопать «макроподобный» инструмент генерации кода, который я буду запускать на HTML-файлах для замены, например «#header» с содержимым header.html. Таким образом, загрузка страницы потребует одного запроса для одного файла HTML, что звучит лучше.

Каков умный способ достичь этого? Я уверен, что эта проблема решена тысячу раз.

EDIT: Серверная сторона кодируется в Python + cherrypy. (Я предполагаю, что разумно стараться избегать динамического генерирования HTML при работе с веб-приложениями «web 2.0-ish». Пожалуйста, поправьте меня, если я ошибаюсь. Как я уже сказал, я очень новичок в этой среде.)

Спасибо за ваши идеи,

лара

+0

По моему мнению, это довольно логичный подход. «Пустые» блоки не имеют никаких негативных коннотаций в мире HTML, поэтому то, что вы делаете, совершенно законно. –

+0

отредактировал мой ответ, чтобы включить способ создания шаблона с использованием фреймворков – marcgg

+0

Что вы используете на стороне сервера? Мы не можем ответить на ваш вопрос, не зная. – Domenic

ответ

5

Если вы хотите включить файлы, пожалуйста, рассмотрите возможность использования некоторых языков бэкэнда таких как PHP или ASP. Javascript на самом деле не предназначен для этого, даже если это будет работать.

<?php include 'other_file.php'; ?> 

Использование JavaScript, чтобы сделать это приведет, я думаю, плохой SEO и загрузка страницы может выглядеть странно для конечного пользователя. Если вы действительно не хотите использовать бэкэнд-язык, some IDE have a way to handle templates, вы могли бы изучить это.

Что касается каркасов, у большинства из них есть способ обработки шаблонов. ASP.NET имеет главную страницу, Ruby on Rails имеет макеты.

Вот пример использования Rails:

<html> 
... 
<div id="content"> <%= yield %> </div> 
... 
</html> 

Здесь все содержание подстраницу войдет в «выход». Вот вам link, чтобы узнать больше об этом.

Некоторые каркасы могут обрабатывать несколько держателей мест.

+2

Учитывая доступность, использование javascript для вывода контента - это просто ад неправильного подхода. – dusoft

+0

Марк, я не женат на идее включения файлов. Мне просто интересно, как люди, которые не генерируют html, динамически избегают дублирования общих элементов страницы на всех страницах своих сайтов. спасибо за любую помощь. – laramichaels

+0

@lara: Я бы сказал, что эти люди либо используют шаблон (cf my edit on dreamweaver), либо просто дублируют код. – marcgg

1

В какой-то степени это зависит от того, что вы используете на стороне сервера, чтобы отображать страницы. Если вы используете скрипты на стороне сервера для создания страницы, вы должны иметь возможность использовать веб-фреймворк (например, Django или RubyOnRails) или даже просто базовый механизм шаблонов, такой как Genshi. Базовая функциональность может быть даже встроена в язык, который вы используете (т.е.PHP)

Если это всего лишь статический HTML, вы можете захотеть изучить настройку некоторой части серверной части, например Apache SSI или NGINX SSI. Вам нужно будет выбрать тот, который работает с любым сервером, который вы используете, и вам потребуется достаточно доступа для установки и настройки плагина или модуля.

В качестве альтернативы вам может потребоваться использовать скрипт для создания ваших страниц (редактировать, создавать и развертывать). Простой подход с использованием cat/sed/awk/make (дополнительная полезная ссылка - Sed & Awk) может быть всем, что вам нужно, или вы можете использовать механизм шаблонов и такой язык, как Python или Perl.

+0

большое спасибо! Веб-приложение закодировано в python, но я (недобросовестно?) Пытаюсь сохранить все статические HTML. Я не знал, что NGIX может это сделать для меня, и это должно решить. :) -l – laramichaels

0

Я бы включил обработанную серверную сторону, и это будет означать меньшее количество запросов от клиента, а также может иметь другие преимущества (проще для отладки js и т. Д.).

Наличие серверного процесса включает в себя, действительно, не будет оказывать на него серьезного напряжения.

Смежные вопросы