простое меню средствами JavaScript

меню: просто и удобно

В этой статье поднимается старая затертая тема - повторяющееся на разных страницах сайта меню.Я думаю, многие разработчики сталкивались с ситуацией, когда меню или список должны повторяться в нескольких местах, но при этом необходимо обеспечить их удобное обновление и расширение. Решать проблему в лоб - непосредственно кодом html - не очень удобно, особенно при количестве повторений больше 5, покольку при добалении/изменении придется вручную править в 5 и более местах. С помощью JavaScript можно решить задачу следующим образом.

Выносим меню в отдельный файл:

with(document) {
  write('');
  write('меню просто и удобно');
  write('tree (дерево)');
  write('drag&drop');
  write('изменение размера блока');
  write('');
}

При достаточно объемном списке с одинаковым оформлением элементов можно попробовать еще сильнее упростить задачу:

var items1 = {"basic.html" : "Основы", "forex.html" : "Forex", 
		"pif.html" : "ПИФы", "bank.html" : "Банки"};
for (var key in items1)
document.write(""+items1[key]+"
");

Теперь добавление/удаление нового элемента сводится к редактированию даже не строки, а двух фраз. На любой странице, где необходимо меню, можно написать:

проблемы:

если хотите, чтобы меню участвовало в индексации, придется на одной из страниц, лучше на главной, оставить html код, ибо поисковые роботы исполнять JavaScript пока не умеют;

А почему бы не использовать такую давно известную вещь как SSI (Server Side Includes). Понятно, что если хостинг не поддерживает, то надо выкручиваться другими путями, но об этом в статье ни слова.
К тому же, страницы, содержащие "SSI код" будут правильно обрабатываться как поисковиками так и браузерами с отключенной/отсутствующей поддержкой JavaScript...

тестер 30.07.10 17:18

прикольно!
аффтар жжот!!
Спасибо!!!

Намик 13.08.10 13:19

Добрый день!Очень понравилась статья про одинаковые меню на странице "http://easywebscripts.net/javascriptmenu.htm". Всё проверил, всё нормально. У меня похожая ситуация. Я меню сделал в HTML(40 стр.) в виде таблиц,но когда использую Ваш метод, ничего не работает. Т.е. если что-то надо напечатать в JS с помощью documentwrite, то всё нормально, как только хочу вставить таблицу, ничего не идёт.

В HTML, где нужно вызвить меню стоит строка
<Script type="text/javascript" src="menu.js"></Script>

А вот menu.js(общий набросок)
Documentwrite("<Table>");
Documentwrite("<Tr>");
Documentwrite("<Td");
Documentwrite("</Td>");
Documentwrite("</tr>");
Documentwrite("</Table>");

Если можно, ответьте и на почту:
namig.alimardanov@yandex.ru
Спасибо

Если вам помогла или просто понравилась эта статья вы можете отблагодарить автора кликнув по рекламе. Спасибо!

комментировать:

прежде чем писать комментарий убедитесь, пожалуйста, что он не попадает в нижеследующие категории:

не стоит писать "я чайник, помогите ..." или "я начинающий, объясните ..." - уважайте себя! может вы и новичок, но ведь не тупой же! сами вполне способны во всем разобраться, тем более, что материал здесь изложен весьма доступно
не пишите вопросы типа "как мне сделать такую же менюху как наверху?", "куда вставлять этот код?", "как устроен интернет?" и т.д. - уважайте время автора!
комментарии вида "все, что здесь написано - бред" будут оставлены только если будут подписаны "я такой-то, разработчик сайта такого-то с посещаемостью 1000 хостов в день" и т.п. Если вы не согласны с чем-то - обоснуйте, напишите как правильно, а писать простые ругательства не надо, это не забор

прямые оскорбления кого бы то ни было будут удалятся!
здоровая критика приветствуется!

от кого:

меню: просто и удобно

Комментарии: