Методы объекта window

У этого объекта есть много полезных методов, но основным можно считать метод open(), с помощью которого создается новое окно браузера (загружается еще одна его копия). Синтаксис этого метода представлен ниже:

переменная = window.open([имя_файла], [имя_ссылки_окна],

[строка_параметров])

В переменной хранится возвращаемая методом ссылка на новое окно, которую можно использовать для доступа к нему из сценария JavaScript.

Первым параметром имя_файла определяется полный или относительный URL-адрес открываемого в окне документа (если задана пустая строка, то открывается пустая станица).

Второй параметр имя_ссылки_окна позволяет задать имя вновь открытого окна, которое можно использовать в документе HTML в атрибуте target гипертекстовой ссылки для указания загрузки в него документа.

Параметр строка_параметров — строка, представляющая список параметров вновь создаваемого окна со значениями. Каждый параметр задается в виде параметр=значение. Все параметры вместе со своими значениями в строке отделены друг от друга запятыми. Допустимые параметры:

height=высота — определяет высоту окна в пикселях;

width=ширина — определяет ширину окна в пикселях;

left=значение — определяет горизонтальную координату верхнего левого окна в пикселях;

top=значение — определяет вертикальную координату верхнего левого окна в пикселях;

resizable={yes|no|1|0} — может ли пользователь изменять размеры окна;

location={yes|no|1|0} — отображается ли адресная строка;

menubar={yes|no|1|0} — отображается ли строка меню;

scrollbars={yes|no|1|0} — отображаются ли полосы прокрутки;

titlebar={yes|no|1|0} — отображается ли строка заголовка окна (только для HTML-приложений);

toolbar={yes|no|1|0} — отображается ли панель инструментов;

status={yes|no|1|0} — отображается ли строка состояния.

Например, следующий вызов, создаст новое окно браузера без панели инструментов и полос прокрутки, загрузив в него документ с указанным первым параметром абсолютным адресом. В любом документе HTML, для ссылки на это окно можно использовать имя linkWin. В сценарии ссылаться на это окно можно с помощью переменной winExample.

winExample = window.open(
" https://www.bhv.ru/library/index.html",

" linkWin", " toolbar=no, scrollbars=yes")

Вывод во вновь открытое окно осуществляется методом write() объекта document этого окна.

Закрывается окно методом close() без параметров:

window.close()

В сценарии можно использовать специальное имя self для ссылки на текущее окно или использовать переменную, хранящую ссылку на требуемое окно:

self.close()

newWindow.close()

4Пример 14. Открытие нового окна и запись в него

Создадим страницу HTML, открывающую новое окно браузера при щелчке в любом месте документа. Для этого обработчику onclick объекта document присвоим ссылку на функцию openNewWindow(), в которой открывается новое окно newWind и в него записывается абзац:

< script>

window.document.onclick = openNewWindow

function openNewWindow(){

newWind = window.open(

" ", " _blank",

" top=10, left=10, width=300, height=50, " +

" scrollbars=no, status=no, titlebar=no, toolbar=no, " +

" location=no, resizable=yes, menubar=no")

newWind.document.write(" < p> Предложение из сценария.< /p> ")

}

< /script>

< BODY >

< P> Щелчок в области документа откроет новое окно.< /P>

< /BODY>

Обратим внимание, что в качестве имени ссылки на окно из документа HTML можно указывать ключевые слова _blank и т. п., используемые в атрибуте target гиперссылок в соответствии со стандартом HTML.

Ряд методов объекта window влияет на положение окна относительно экрана монитора, его размеры и отображаемый документ:

Ряд методов объекта window отображают диалоговые окна для взаимодействия с пользователем (мы с ними уже знакомы из предыдущих уроков):

Метод setTimeout() запускает выполнение кода JavaScript, задаваемого первым строковым параметром, через определенный промежуток времени после выполнения метода.

Метод setInterval() запускает периодический " процесс" выполнения кода JavaScript, задаваемого первым строковым параметром, с интервалом, указанным вторым параметром.

переменная = window.setTimeout(строка_кода, интервал, [язык])

переменная = window.setInterval(строка_кода, интервал, [язык])

Интервал задается в миллисекундах (1000 соответствует 1 секунде).

Необязательный параметр язык определяет язык сценария для выполняемого кода (JavaScript, VBScript). По умолчанию предполагается язык JavaScript.

Для остановки запущенных процессов используются соответственно методы и, параметрами которых является переменная, в которой сохранен результат запуска " процесса":

window.clearTimeout(переменная)

window.clearInterval(переменная)

Одновременно можно запустить много " процессов". Обычно метод setInterval() используется для создания страницы HTML с движущимися элементами.

4Пример 15. Периодический " процесс"

Ниже приведен код страницы HTML, после загрузки которой каждые три секунды будет появляться сообщение, генерируемое вызовом функции myMessage():

< SCRIPT>

function myMessage() {

alert(" My Message")

}

< /SCRIPT>

< BODY onload='setInterval(" myMessage()", 3000)'>

< p> Каждые три секунды будет появляться сообщение< /p>

< /BODY>

Фреймы

В HTML элемент-контейнер < FRAMESET>...< /FRAMESET>, используемый вместо элемента BODY, определяет специальный тип документа, позволяющий отображать одновременно несколько документов HTML в одном окне браузера. Область отображения браузера разбивается на несколько частей (фреймов) с помощью вложенных в элемент FRAMESET элементов FRAME, в которых и отображаются соответствующие документы HTML.

Контейнер < FRAMESET> может содержать кроме элементов < FRAME> и другие теги < FRAMESET>, образуя, таким образом, вложенные наборы фреймов. Пример страницы HTML, задающей вложенные наборы фреймов, представлен ниже:

< FRAMESET COLS=" 30%, 70%" >

< FRAMESET ROWS=" 30%, 70%" >

< FRAME SRC=" " NAME=" clock" >

< FRAME SRC=" menu.html" NAME=" menu" >

< /FRAMESET>

< FRAME SRC=" " NAME=" content" >

< /FRAMESET>

Для доступа к фреймам из сценария JavaScript предусмотрен объект top, являющийся родителем всех фреймов (в нашем примере clock, menu и content). Для ссылки на фреймы страницы можно использовать либо символические имена, либо свойство-массив frames объекта top, в котором содержатся ссылки на все фреймы страницы. Так, на первый фрейм можно сослаться двумя способами:

top.clock

top.frames[0]

Каждый фрейм в сценарии представляется как объект window, обладающий всеми рассмотренными выше свойствами и методами этого объекта.

Свойство location фрейма содержит адрес загруженного в него документа. Изменение значения этого свойства приведет к загрузке нового документа в соответствующий фрейм. Следующий фрагмент кода HTML задает на странице menu.html кнопку с именем Во фрейм clock, при щелчке на которую во фрейм clock загружается страница HTML:

< FORM>

< INPUT TYPE=" button" VALUE=" Во фрейм clock"

onclick=" top.clock.location='clock.html'" >

< /FORM>

Для доступа из сценария к странице, загруженной во фрейм, следует использовать его свойство-объект document.

4Пример 16. Взаимодействие с фреймом из сценария

Создадим страницу с двумя фреймами:

< FRAMESET ROWS=" 30%, 70%" >

< FRAME SRC=" frame1.html" NAME=" Frame1" >

< FRAME SRC=" " NAME=" Frame2" >

< /FRAMESET>

Во фрейм Frame1 загрузим файл frame1.html.:

< FORM>

< input type=" button" value=" Запись во фрейм Frame2"

onclick=" top.Frame2.document.write('< p> Я из фрейма Frame1.< /p> ')" >

< /FORM>

При щелчке на кнопке Запись во фрейм Frame2 второй фрейм будет заполняться содержимым, определенным в качестве параметра метода write объекта document этого фрейма.

Если загружаемый во фрейм документ сам содержит набор фреймов, то объектная модель немного усложняется. В этом случае получить доступ ко всем фреймам через объект top нельзя. фреймы, отображаемого в заданном фрейме документа, являются подчиненными этому фрейму, который, в свою очередь, порождается от объекта верхнего уровня top.

4Пример 17. Взаимодействие вложенных фреймов

Загружаемая страница с фреймами frame.html:

< FRAMESET ROWS=" 30%, 70%" >

< FRAME SRC=" frame1-1.html" NAME=" Frame1" >

< FRAME SRC=" frame2.html" NAME=" Frame2" >

< /FRAMESET>

Файл frame2.html (названия фреймов могут быть такими же, как и в главной странице!):

< FRAMESET COLS=" 30%, 70%" >

< FRAME SRC=" " NAME=" Frame1" >

< FRAME SRC=" " NAME=" Frame2" >

< /FRAMESET>

Файл frame1-1.html, предоставляющий запись во фрейм Frame1 страницы frame2.html:

< FORM> < input type=" button" value=" Запись во второй фрейм."

onclick=" top.Frame2.Frame1.document.write('< p> Я из фрейма Frame1 файла frame1-1.html.< /p> ')" > < /FORM>

Можно на фрейм Frame1 файла frame2.html сослаться и так:

top.frames[1].frames[0]