Добавляем...


Фреймы: специальный случай окон
Типичные недоразумения среди Web-разработчиков вызывает взаимосвязь между фреймами и окнами. С точки зрения как (X)HTML, так и JavaScript каждый фрейм, показанный на экране, является окном, которым можно управлять. Когда окно браузера содержит множество фреймов, можно получить доступ к каждому из этих объектов через window.frames[ ] — массив индивидуальных фреймов, содержащихся в данном окне. Основные свойства, полезные для работы с фреймами, представлены в таблице. Обратите внимание на то, что многие из этих свойств соответствуют зарезервированным значениям для фреймов, используемым в (X)HTML.
Свойство Window Описание
frames[] Массив объектов фреймов, содержащихся в данном окне
length Число фреймов в окне. Должно совпадать со значением window, frames . length
name Текущее имя окна. Может читаться и устанавливаться, начиная с JavaScript 1.1
parent Ссылка на родительское окно
self Ссылка на текущее окно
top Ссылка на окно верхнего уровня. Часто окно верхнего уровня и родительское оказываются одним и тем же окном, если только дескриптор <frame> не загружает документы, также содержащие фреймы
window Еще одна ссылка на текущее окно

Главной проблемой использования фреймов в JavaScript является отслеживание имен фреймов и их взаимосвязей, чтобы ссылки между фреймами формировались корректно. Предположим, имеется такой документ frames.html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>FrameSet Test</title>
<meta http-equiv="content-type" content="text/html; " />
</head>
<frameset rows="33%,*,33%">
<frame src="framerelationship.html" name="frame1" id="frame1" />
<frame src="moreframes.html" name="frame2" id="frame2" />
<frame src="framerelationship.html" name="frame5" id="frame5" />
</frameset>
</html>

В данном случае окно, содержащее этот документ, оказывается родительским для трех фреймов (frame1, frame2 и frame5). Можно было бы ожидать, что для определения числа фреймов в окне нужно использовать нечто подобное

window.frames.length

но на самом деле придется выполнять сценарий из дочернего фрейма. Поэтому следует использовать

window.parent.frames.length

или просто

parent.frames.length

Свойство parent позволяет определить родительское окно. Можно также использовать свойство top, которое обеспечивает ссылку на окно верхнего уровня, содержащее все остальные. Таким образом, можно использовать top.frames.length. Однако следует быть осторожным, хотя при отсутствии вложенных фреймов родительское окно и является окном верхнего уровня. Чтобы получить доступ к конкретному фрейму, можно использовать как его имя, так и место в массиве, поэтому оператор

parent.frames[0].name

должен напечатать имя первого фрейма, которым в нашем случае является framel. Можно также получить доступ к фрейму из другого дочернего фрейма, используя parent.framel или

parent.frames ["frame1"]

, если учесть ассоциативность массива коллекции объектов. Поскольку фрейм содержит окно, можно использовать все методы объектов Window и Document для его содержимого.
Следующий пример раскрывает идею использования имен фреймов и способы их связывания. Для этого примера требуются три файла: два с содержимым фреймов (frames.html и moreframes.html) и один — с текстом документа (framerelation-ship.html), содержащего сценарий, отображающий взаимосвязи фреймов.

Файл frames.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>FrameSet Test</title>
<meta http-equiv="content-type" content="text/html; " />
</head>
<frameset rows="33%,*,33%">
<frame src="framerelationship.html" name="frame1" id="frame1" />
<frame src="moreframes.html" name="frame2" id="frame2" />
<frame src="framerelationship.html" name="frame5" id="frame5" />
</frameset>
</html>


Файл moreframes.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>More Frames</title>
<meta http-equiv="content-type" content="text/html; " />
</head>
<frameset cols="50%,50%">
<frame src="framerelationship.html" name="frame3" id="frame3" />
<frame src="framerelationship.html" name="frame4" id="frame4" />
</frameset>
</html>


Файл framerelationship.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Frame Relationship Viewer</title>
<meta http-equiv="content-type" content="text/html; " />
</head>
<body>
<script type="text/javascript">
<!--
var msg="";
var i = 0;
msg += "<h2>Window: "+ window.name + "</h2><hr />";
if (self.frames.length > 0)
{
msg += "self.frames.length = " + self.frames.length + "<br />"
for (i=0; i < self.frames.length; i++)
msg += "self.frames["+i+"].name = "+ self.frames[i].name + "<br />";
}
else
msg += "Current window has no frames directly within it<br />";
msg+="<br />";
if (parent.frames.length > 0)
{
msg += "parent.frames.length = " + parent.frames.length + "<br />"
for (i=0; i < parent.frames.length; i++)msg += "parent.frames["+i+"].name = "+ parent.frames[i].name +
"<br />";
}
msg+="<br />";
if (top.frames.length > 0)
{
msg += "top.frames.length = " + top.frames.length + "<br />"
for (i=0; i < top.frames.length; i++)
msg += "top.frames["+i+"].name = "+ top.frames[i].name + "<br />";
}
document.write(msg);
// -->
</script>
</body>
</html>

назад: далее: Внутренние фреймы


добавить комментарий
(без перезагрузки и регистрации)


10 случайных разделов

Что ищем на сайте ?


Примеры кода на сайте







@ 2008-2011 Amber
При использовании материалов ссылка на сайт обязательна
Яндекс.Метрика