JavaScript позволяет из программы создавать и открывать окна с HTML текстами, структурами form и frame. Объекты типа window являются наивысшим элементом в JavaScript клиент-иерархии . Для лучшего понимания как работает и взаимодействует система окон и кадров (frame) необходимо знать основные функции управления этими структурами:

     - открытие и закрытие окон,
     - использование кадров (frame),
     - обращения к окнам и кадрам,
     - навигация в многооконной среде.

     Окно открывается автоматически при вызове браузера и пользователь может открыть новое окно используя операцию New Web Browser в меню браузера (File menu). Окна закрываются при выполнении операций Close или Exit в File menu браузера. Используя операторы JavaScript можно выполнять открытие и закрытие окон программным способом.

     Открытие окна в JavaScript программе выполняется open методом объекта window. Следующий оператор создает окно с именем msgWindow, в котором будет интерпретироваться HTML страница из файла sesame.html:

         msgWindow=window.open("sesame.html")

     Другой оператор создает новое окно с домашней страницей фирмы Netscape:

         homeWindow=window.open("http://www.netscape.com")

     Окно может иметь два имени. Приведенный ниже оператор создает окно с двумя именами. Первое имя "msgWindow" используется при обращении к свойствам и методам объекта window, а второе - "displayWindow" используется как окно-цель (target) в гипертекстовых ссылках.

        msgWindow=window.open("sesame.html","displayWindow")

     Вообще говоря, для создания нового окна необязательно задавать его имя. Это нужно делать в случае необходимости обращения к нему из других окон или кадров (frame).
     При создании окна можно задавать различные его атрибуты, такие как: ширина, высота, наличие инструментальной линейки, линейки прокрутки и др.
     Например:

         msgWindow=window.open("sesame.html","displayWindow","toolbar=no,scrollbars=yes")

     Закрыть окно программным способом можно применяя метод close к window объекту. Однако, закрыть кадр (frame) без закрытия всего окна - нельзя.
     Следующие операторы представляют различные способы закрытия текущего окна:

window.close()
self.close()
// Do not use the following statement in an event handler
close()

     Последний оператор недопустимо использовать в обработчиках событий.
     Следующий оператор закрывает окно с именем msgWindow:

msgWindow.close()

     Frame (кадр) - это под-окно в отдельной WEB странице с самостоятельными атрибутами: собственными URL, цветом, линейками прокрутки и др.

     Структура frame создается HTML тегами <FRAMESET>.

Пример 1.

<FRAMESET ROWS="90%,10%">
   <FRAMESET COLS="30%,70%">
       <FRAME SRC=category.html NAME="listFrame">
       <FRAME SRC=titles.html NAME="contentFrame">
   </FRAMESET>
   <FRAME SRC="navigate.html" NAME="navigateFrame">
</FRAMESET>

     Следующая диаграмма показывает иерархию frames, приведенных в примере. Все три frames имеют одного "предка", несмотря на то, что два из них созданы в отдельном frameset. Это потому, что "предком" frame всегда является объект типа window, а не frameset.

top
   |
   +--listFrame (category.html)
   |
   +--contentFrame (titles.html)
   |
   +--navigateFrame (navigate.html)

     Можно обращаться к отдельным frame в приведенном примере как к элементам массива frames:

     listFrame - top.frames[0],
     contentFrame - top.frames[1],
     navigateFrame - top.frames[2].

5.4. Обращения к объектам windows и frames.

     Имя, которое используется при обращении к объекту window зависит в каком контексте происходит обрашение:
       - для обращения к свойствам и методам этого объекта или его обработчикам событий,
       - или как окну-цели при гипертекстовых ссылках.

     Поскольку window - наивысший объект в JavaScript клиент-иерархии, его обозначение является существенным для определения содержащихся в любом окне объектов.

5.4.1. Обращения к свойствам , методам и обработчикам событий объекта window.

     В JavaScript обращаться к свойствам, методам или обработчикам событий объекта window можно различными способами:

     - self или window. self или window - являются синонимами текущего окна и допускается обращение:

     window.close() или self.close().

     - имя переменной window . Переменная window образуется при выполнении операции открытия окна и может в явном виде указаываться при закрытии окна. Например, оператор msgWindow.close() закрывает окно под именем msgWindow. Однако, при операциях открытия и закрытия окон в обработчиках событий надо задавать window.open() или window.close() вместо простого использования open() или close(), поскольку задание просто close() без указания объекта равносильно заданию document.close().

     - возможность опускать имя window объекта. В таком случае по умолчанию предполагается обращения к свойствам и методам текущего активного окна. Например, close() - закрывает текущее окно.

     Пример1. Обращение к элементам текущего окна. Приведенный ниже оператор обращается к form под именем musicForm текущего окна.

if (self.document.musicForm.checkbox1.checked) {
     alert('The checkbox on the musicForm is checked!')}

     Пример 2. Обращение к другому окну. Операторы в примере обращаются к form под именем musicForm, находящейся в другом окне под именем checkboxWin

// Determine if a checkbox is checked
if (checkboxWin.document.musicForm.checkbox2.checked) {
     alert('The checkbox on the musicForm in checkboxWin is checked!')}

// Check the checkbox
checkboxWin.document.musicForm.checkbox2.checked=true

// Determine if an option in a select object is selected
if (checkboxWin.document.musicForm.musicTypes.options[1].selected)
     {alert('Option 1 is selected!')}

// Select an option in a select object
checkboxWin.document.musicForm.musicTypes.selectedIndex=1

Пример 3. Обращение к кадру (frame) другого окна.

     window2.frame2.document.bgColor="violet"

5.4.2. Обращения к объекту типа window при гиперссылках.

     Используется имя окна в явном виде (не переменная window!) при обращениях к окну для задания гипертекстовой ссылки.

Пример1. Следующие операторы создают гипертекстовую ссылку на второе окно. Сначала по "кнопке" в form создается новое окно с именем window2, затем указывается ссылка с загрузкой HTML файла doc2.html в это вновь открытое окно, и по другой "кнопке" в этой же form окно закрывается.

<P>
<INPUT TYPE="button" VALUE="Open window2" onClick="msgWindow=window.open('','window2','resizable=no,width=200,height=200')">
<P>
<A HREF="doc2.html" TARGET="window2"> Load a file into window2</A>
<P>
<INPUT TYPE="button" VALUE="Close window2" onClick="msgWindow.close()">

Пример 2. Якорь в другом окне. В примере создается гипертекстовая ссылка на якорь (anchor) под именем numbers в файле doc2.html для другого окна под именем window2. Если такого окна нет, браузер образует новое.

<A HREF=doc2.html#numbers TARGET="window2">Numbers</A>

5.5. Навигация в многооконной среде.

     На экране компьютера может быть одновременно открыто несколько окон браузера с различными URL. Пользователь, передвигая указатель мыши, может активизировать выбранное окно, поработать с ним и перейти к другому. Это же можно проделать и программным путем операторами JavaScript. При этом, изменяя значения полей в разных окнах, текущее окно остается активным.(находяшимся в фокусе). Сфокусированными могут быть и отдельные элементы окна, например, поля ввода в form.

Пример1. Фокусировка объекта в другом окне. В примере фокусируется элемент city структуры form в окне с именем checkboxWin. При этом фокусируется и становится активным окно.

checkboxWin=window.open("doc2.html")
...
checkboxWin.document.musicForm.city.focus()

Пример 2. Фокусировка окна с помощью гипертекстовой ссылки. При выборе пользователем этой ссылки фокус переключается на окно window2. Если такого окна не было, браузер создаст новое.

<A HREF="doc2.html" TARGET="window2"> Load a file into window2</A>