Как обойти недостатки фреймов.
Одним из главных недостатков фреймов является неправильная обработка страниц, содержащих фреймы поисковыми машинами. Когда пользователь находит такой документ через поисковый сервер, то он попадает лишь на один из фреймов, но не видит истинного отображения страницы. Значит необходимо предусмотреть для посетителя средства навигации, помогающие попасть на стартовую страницу раздела.
Итак рассмотрим пример страницы, содержащей фреймы. Пусть у нас есть документ c именем "MyFrame.html", в котором имеется два вертикальных фрейма. В левом фрейме будет располагаться навигационное меню, а в правый будет загружаться информация.
<FRAMESET cols="30%,70%" frameborder="yes" framespacing="1"> <FRAME name="MenuFrame" src="TextMenu.html"> <FRAME name="MainFrame" src="MainText.html"> </FRAMESET>
Проблема с левым фреймом решается очень просто. Сначала необходимо выполнить проверку, загружена ли страница во фрейм или открыта отдельно. Проверка условия в JavaScript осуществляется с помощью оператора If. Используем свойство length, объекта frame, отражающего количество фрэймов-потомков внутри фрейма. Если его величина равна 0, значит страница загружена не во фрейм, и необходимо загрузить управляющую страницу "MyFrame.html". Загрузка необходимой страницы в JavaScript выполняется с помощью объекта location. Выглядеть это будет так:
<script language="JavaScript">
<!--
if(self.parent.frames.length==0)
{
self.parent.location="MyFrame.html";
}
//-->
</script>
Таким образом, если пользователь найдет через поисковую систему по ключевым словам нашу страницу "TextMenu.html" и попытается ее открыть, то произойдет загрузка в окно броузера управляющей страницы "MyFrame.html".
Для правого фрэйма, тоже необходимо выполнить проверку, и если данная страница загружена не во фрейме, то можно, например, отобразить ссылку, предлагающую перейти на стартовую страницу:
<script language="JavaScript">
<!--
if(self.parent.frames.length==0)
{
document.writeln("<A href='MyFrame.html' target='_top'>");
document.writeln("Перейти на стартовую страницу раздела</A>");
}
//-->
</script>
Чтобы было понятнее напишем конкретные примеры.
Наша управляющая страница "MyFrame.html" будет иметь следующий код:
<HTML> <HEAD> <TITLE>Страница с двумя вертикальными фреймами</TITLE> </HEAD> <FRAMESET cols="30%,70%" frameborder="yes" framespacing="1"> <FRAME name="MenuFrame" src="TextMenu.html"> <FRAME name="MainFrame" src="MainText.html"> </FRAMESET> </HTML>
Страница, отображаемая в левом фрейме и содержащее навигационное меню, будет иметь следующий код:
<HTML>
<HEAD>
<BASE TARGET=MainFrame>
<TITLE></TITLE>
</HEAD>
<script language="JavaScript">
<!--
if(self.parent.frames.length==0)
{
self.parent.location="MyFrame.html";
}
//-->
</script>
<BODY>
<CENTER><H3>Первый Frame</H3></CENTER>
<P>
<A href="MainText.html">
Пауло КОЭЛЬО - Рождественская сказка</A>
<P>
<A href="Konfuciy.html">
Тищенко Валерий - Конфуций</A>
<P>
<a href="../TextMenu.html" target='_parent'>
На стартовую страницу</a>
</BODY>
</HTML>
Результат работы данного кода можно увидеть на этой ссылке. Как вы видите, несмотря на то, что это ссылка на один из документов, у нас загрузилась полностью вся страница с обоими фреймами.
Файл "MainText.html" содержащий текст для отображения в правом фрейме будет иметь следующий код:
<HTML>
<HEAD>
<TITLE>Пауло КОЭЛЬО - Рождественская сказка</TITLE>
</head>
<body>
<TABLE width=100% border=0>
<TR>
<TD>
<h3>Пауло КОЭЛЬО</h3>
</TD>
<TD align="right">
<script language="JavaScript">
<!--
if(self.parent.frames.length==0)
{
document.writeln("<A href='MyFrame.html' target='_top'>");
document.writeln("Перейти на стартовую страницу раздела</A>");
}
//-->
</script>
</TD>
</TR>
</TABLE>
<h4>Рождественская сказка</h4>
<div>
Как повествуется в одной знаменитой древней легенде, некогда в
прекрасных рощах Ливана родились три кедра.
....................
<div>
Так исполнилась судьба трех ливанских кедров: как это всегда
бывает с мечтами, мечты их сбылись, но совсем иначе, чем они
себе представляли.
<TABLE width=100% border=0>
<TR>
<TD>
</TD>
<TD align="right">
<script language="JavaScript">
<!--
if(self.parent.frames.length==0)
{
document.writeln("<A href='MyFrame.html' target='_top'>");
document.writeln("Перейти на стартовую страницу раздела</A>");
}
//-->
</script>
</TD>
</TR>
</TABLE>
</BODY>
</HTML>
Посмотреть как выглядит данная страница можно на этой ссылке. В начале и в конце страницы вы увидите приглашение перейти на стартовую страницу раздела. Если вы щелкните по той ссылке, то загрузится опять полная страница с обоими фреймами. Обратите внимание, что после загрузки полной версии страницы, ссылка для перехода на стартовую страницу отображаться уже не будет.
Теперь, после того как мы разобрались с недостатками фреймов,
давайте посмотрим как можно, используя JavaScript,
менять сразу содержимое двух разных фреймов, нажав на одну ссылку.