Ссылки между фреймворками
Все фреймы на странице предоставляются как атрибуты объекта окна в виде коллекции. Например: window.frames представляет коллекцию всех фреймов на странице. Это аналогично объектам формы, объектам ссылок, объектам изображений и т. д. ., но разница в том, что эти коллекции являются свойствами документа. Поэтому для ссылки на подкадр можно использовать следующий синтаксис:
Скопируйте код кода следующим образом:
window.frames["frameName"];
window.frames.frameName
окно.frames[индекс]
Среди них слово window также может быть заменено или опущено на self. Предполагая, что имя_фрейма является первым фреймом на странице, следующие методы записи эквивалентны:
Скопируйте код кода следующим образом:
self.frames["frameName"]
self.frames[0]
кадры[0]
имя_фрейма
Каждый фрейм соответствует HTML-странице, поэтому этот фрейм также является независимым окном браузера. Он обладает всеми свойствами окна. Так называемая ссылка на фрейм — это ссылка на объект окна. С помощью этого объекта окна вы можете легко управлять страницами в нем, например, используя объект window.document для записи данных на страницу, используя свойство window.location для изменения страницы в фрейме и т. д.
Ниже представлены взаимные ссылки между различными уровнями фреймворков:
1. Ссылка от родительского кадра к дочернему кадру
Зная вышеизложенные принципы, очень легко ссылаться на дочерний фрейм из родительского фрейма, то есть:
Скопируйте код кода следующим образом:
window.frames["frameName"];
Это ссылается на подкадр с именемframeName на странице. Если вы хотите ссылаться на подкадр внутри подкадра, в соответствии с природой указанного кадра, который на самом деле является объектом окна, вы можете реализовать это следующим образом:
Скопируйте код кода следующим образом:
window.frames["frameName"].frames["frameName2"];
Таким образом осуществляется ссылка на подкадр второго уровня, и по аналогии может быть достигнута ссылка на многоуровневые структуры.
2. Ссылка из дочернего кадра на родительский кадр
Каждый объект окна имеет родительское свойство, которое представляет его родительский фрейм. Если фрейм уже является фреймом верхнего уровня, window.parent также представляет сам фрейм.
3. Ссылки между родственными кадрами
Если два кадра являются подкадрами одного и того же кадра, они называются родственными кадрами и могут ссылаться друг на друга через родительский кадр. Например, страница включает в себя два подкадра:
Скопируйте код кода следующим образом:
<frameset rows="50%,50%">
<frame src="1.html" name="frame1" />
<frame src="2.html" name="frame2" />
</frameset>
В кадре 1 вы можете использовать следующий оператор для ссылки на кадр 2:
Скопируйте код кода следующим образом:
self.parent.frames["frame2"];
4. Взаимные ссылки между разными уровнями фреймворков
Уровень фреймворка соответствует фреймворку верхнего уровня. Если уровни различны, если вы знаете уровень, на котором находитесь, а также уровень и имя другого фрейма, вы можете легко получить доступ друг к другу, используя свойства объекта окна, на который ссылается фрейм, например:
Скопируйте код кода следующим образом:
self.parent.frames["childName"].frames["targetFrameName"];
5. Ссылка на фрейм верхнего уровня
Подобно родительскому свойству, объект окна также имеет свойство top. Он представляет собой ссылку на кадр верхнего уровня, которую можно использовать для определения того, является ли сам кадр кадром верхнего уровня, например:
Скопируйте код кода следующим образом:
//Определяем, является ли этот кадр фреймом верхнего уровня
если (сам == сверху) {
//делаем что-то
}
Изменить страницу загрузки фреймворка
Ссылка на фрейм является ссылкой на объект окна. Используя атрибут местоположения объекта окна, вы можете изменить навигацию по фрейму, например:
window.frames[0].location="1.html";
Это перенаправляет страницу первого фрейма страницы на 1.html. Воспользовавшись этим свойством, вы даже можете использовать одну ссылку для обновления нескольких фреймов.
Скопируйте код кода следующим образом:
<frameset rows="50%,50%">
<frame src="1.html" name="frame1" />
<frame src="2.html" name="frame2" />
</frameset>
<!--какой-токод-->
<a href="frame1.location='3.html;frame2.location='4.html'" onclick="">ссылка</a>
<!--какой-токод-->
Ссылка на переменные и функции JavaScript в других средах.
Прежде чем знакомить с методами обращения к переменным и функциям JavaScript в других средах, давайте посмотрим на следующий код:
Скопируйте код кода следующим образом:
<script Language="JavaScript" type="text/javascript">
<!--
функция привет(){
alert("Привет, Ajax!");
}
окно.привет();
//-->
</скрипт>
Если вы запустите этот код, появится всплывающее окно «Привет, ajax!», которое является результатом выполнения функции hello(). Так почему же hello() стал методом объекта окна? Потому что все глобальные переменные и глобальные функции, определенные на странице, являются членами объекта окна. Например:
Скопируйте код кода следующим образом:
вар а=1;
оповещение(window.a);
Появится диалоговое окно, показывающее 1. Тот же принцип применяется к совместному использованию переменных и функций между различными платформами путем их вызова через объект окна.
Например: страница просмотра продуктов состоит из двух подфреймов. Левая часть представляет ссылку на категорию продуктов; когда пользователь щелкает ссылку категории, соответствующий список продуктов отображается справа; Покупка] рядом с товаром, чтобы добавить его в корзину.
В этом примере левая страница навигации может использоваться для хранения продуктов, которые пользователь хочет приобрести, поскольку, когда пользователь нажимает ссылку навигации, изменяется другая страница, то есть страница отображения продукта, и сама страница навигации. остается неизменным, поэтому переменные JavaScript не будут потеряны и могут использоваться для хранения глобальных данных. Принцип его реализации следующий:
Предположим, что страница слева — link.html, а страница справа — show.html. Структура страницы следующая:
Скопируйте код кода следующим образом:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<голова>
<title> Новый документ </title>
</голова>
<frameset cols="20%,80%">
<frame src="link.html" name="link" />
<frame src="show.html" name="show" />
</frameset>
</html>
Вы можете добавить такой оператор рядом с продуктами, отображаемыми в show.html:
<a href="void(0)" onclick="self.parent.link.addToOrders(32068)">Добавить в корзину</a>
Среди них ссылка представляет собой структуру навигации. Массив arrOrders определен на странице link.html для хранения идентификатора продукта. Функция addToOrders() используется для реагирования на событие щелчка по ссылке [Купить] рядом со ссылкой. Product id, который он получает, представляет собой идентификатор продукта. Примером является продукт с идентификатором 32068.
Скопируйте код кода следующим образом:
<script Language="JavaScript" type="text/javascript">
<!--
вар arrOrders = новый массив ();
функция addToOrders(id){
arrOrders.push(id);
}
//-->
</скрипт>
Таким образом, вы можете использовать arrOrders на странице оформления заказа или странице просмотра корзины покупок, чтобы подготовить все продукты к покупке.
Платформа может разделить страницу на несколько модулей с независимыми функциями. Каждый модуль независим друг от друга, но может быть подключен через ссылку на объект окна. Это важный механизм в веб-разработке.