Российский государственный гуманитарный университет
Опубликован: 14.08.2003 | Доступ: свободный | Студентов: 23389 / 4435 | Оценка: 4.00 / 3.90 | Длительность: 10:03:00
Лекция 4:

Программируем свойства окна браузера

Аннотация: Рассматриваются вопросы программирования свойств окна браузера, управление окнами, а также работа с фреймами.
Ключевые слова: класс объекта, класс, объект, скрипт, i-frame, фрейм, глобальные переменные, обработка событий, идентификатор, alerter, Locate, имя окна, parent, status bar, апплет, status, Internet Explorer, href, отменить, onClick, окно предупреждения, подкласс, area, схема URL, точечная нотация, скобочная нотация, host, reload, replaceability, кеш, history, forwarder, navigation, S/MIME, метод управления, системные шрифты, confirm, cancellation, OPEN, окно, target, верхняя граница, netscape, resizing, полоса прокрутки, toolbar, CLOSE, focused, blur, setTimeout, вызов метода, setInterval, возвращаемое значение, атрибут, load, tab, программные средства, WID, браузер, парсер, алиас, синоним, потомок, указатель, текущее время, поле ввода, переменная, глобальная, свойство, DHTML, dynamic html, таблица, коллекция объектов, getElementById, символ новой строки, запись, поток, адрес, строковый, литеры, domain-specific, домен, hostname, заголовок страницы, внешний файл, пользователь, cookie, целый, меню, поле, контейнер, frameset, иерархия, ссылка, усложним пример, цвет фона, HTM, коллекция, CGI-скрипт, Actions, отправка данных

Объект window

Класс объектов Window - это самый старший класс в иерархии объектов JavaScript. Объект window, относящийся к текущему окну (т.е. в котором выполняется скрипт), является объектом класса Window. Класс объектов Frame содержится в классе Window, т.е. каждый фрейм - это тоже объект класса Window.

О фреймах речь пойдет ниже, а пока вернемся к объекту window. Объект window создается только в момент открытия окна. Все остальные объекты, которые порождаются при загрузке страницы, есть свойства объекта window. Более того, все глобальные переменные, определенные в данном окне, тоже являются свойствами объекта window. Таким образом, у объекта window могут быть разные свойства при загрузке разных страниц. Кроме того, в разных браузерах свойства объектов и поведение объектов и браузера при обработке событий может быть различным. При программировании на JavaScript чаще всего используют следующие свойства, методы и события объекта window:

Таблица 4.1. Свойства, методы и события объекта window
Свойства Методы События
status
defaultStatus   
location
history
navigator

document
frames[]

opener
parent
self
top
open()
close()
focus()
blur()

alert()
confirm()
prompt()

setTimeout()
setInterval()
clearTimeout()
clearInterval()
Load
Unload

Focus
Blur

Resize
Error

Поскольку объект window является самым старшим, то в большинстве случаев при обращении к его свойствам и методам приставку " window." можно опускать (разумеется, в случае, если вы хотите обратиться к свойству или методу текущего окна, где работает скрипт; если же это другое окно, то необходимо указать его идентификатор). Так, например, можно писать alert('Привет') вместо window.alert('Привет'), или location вместо window.location. Исключениями из этого правила являются вызовы методов open() и close(), у которых нужно указывать имя окна, с которым работаем (родительское в первом случае и дочернее во втором). Свойства frames[], self, parent и top будут рассмотрены в разделе, посвященном фреймам. Свойство opener будет рассмотрено при описании метода window.close().

Свойства объекта window

Поле статуса и свойство window.status

Поле статуса - это первое, что начали использовать авторы HTML-страниц из арсенала JavaScript. Калькуляторы, игры, математические вычисления и другие элементы выглядели слишком искусственно. На их фоне бегущая строка в поле статуса была изюминкой, которая могла действительно привлечь внимание пользователей к Web-узлу. Постепенно ее популярность сошла на нет. Бегущие строки стали редкостью, но программирование поля статуса встречается на многих Web-узлах.

Поле статуса

Рис. 4.1. Поле статуса

Полем статуса (status bar) называют поле нижней части окна браузера сразу под областью отображения HTML-страницы. В поле статуса отображается информация о состоянии браузера (загрузка документа, загрузка графики, завершение загрузки, запуск апплета и т.п.). Программа на JavaScript имеет возможность работать с этим полем как с изменяемым свойством окна. При этом фактически с ним связаны два разных свойства:

  • window.status - значение поля статуса;
  • window.defaultStatus - значение поля статуса по умолчанию.

Значение свойства status можно изменить - и оно тут же будет отображено в поле статуса. Свойство defaultStatus тоже можно менять - и сразу по его изменении оно отображается в поле статуса.

Разница между этими двумя свойствами заключается в их поведении: если свойству status присвоить пустую строку: window.status="", то в поле статуса автоматически будет отображено значение defaultStatus. Обратного же не происходит: при присвоении пустой строки свойству defaultStatus оно и отобразится в поле статуса, независимо от значения свойства status. Следует отметить, что реакция браузеров на описываемые ниже действия со свойствами status и defaultStatus может быть разной в различных браузерах.

Программируем status

Свойство status связано с отображением сообщений о событиях, отличных от простой загрузки страницы. Например, в Internet Explorer при наведении указателя мыши на ссылку обработчик onMouseOver помещает в поле статуса значение URL, указанное в атрибуте HREF этой ссылки (при этом никак не меняя значения свойств status и defaultStatus ). При попадании же курсора мыши на область, свободную от ссылок, обработчик onMouseOut возвращает в поле статуса значение defaultStatus, при условии, что оно не есть пустая строка (опять же никак не меняя значений обоих свойств). Мы можем изменить это поведение, например, как в следующем примере:

<A onMouseOver="window.status='Мышь над ссылкой';return true;"
    onMouseOut="window.status='Мышь увели со ссылки';"
   HREF="http://site.com/">Наведите мышь на ссылку и следите за полем статуса</A>

Обратите внимание на оператор return true в конце обработчика событий onMouseOver. Он необходим для того, чтобы отменить действие по умолчанию (в данном случае - вывод URL в поле статуса), которое, в отсутствие этого оператора, браузер выполнил бы сразу после вывода нами своей строки в поле статуса, и пользователь не успел бы увидеть нашу строку. Аналогичный трюк отмены действия по умолчанию годится и для некоторых других событий ( onClick, onKeyDown, onKeyPress, onMouseDown, onMouseUp, onSubmit, onReset ), с той лишь разницей, что для перечисленных обработчиков отмена выполняется оператором return false.

Для обработчика onMouseOut такого способа отменить действие по умолчанию не существует (к сожалению). Но в данном конкретном случае это не требуется - как уже было сказано, при уводе курсора со ссылки в поле статуса восстанавливается значение defaultStatus только в случае, если это значение не есть пустая строка. Но в нашем случае (по умолчанию при загрузке страницы в IE) оно равно именно пустой строке. Поэтому, уводя курсор с нашей ссылки, мы продолжаем видеть в поле статуса строку "Мышь увели со ссылки". Ситуация изменится в следующем примере, когда мы предварительно зададим свое (непустое) значение defaultStatus.

Программируем defaultStatus

Свойство defaultStatus определяет текст, отображаемый в поле статуса, когда никаких событий не происходит. Дополним предыдущий пример изменением этого свойства в момент окончания загрузки документа, т.е. в обработчике onLoad:

<BODY onLoad="window.defaultStatus='Значение по умолчанию';">

<A onMouseOver="window.status='Мышь над ссылкой';return true;"
    onMouseOut="window.status='Мышь увели со ссылки'; alert('Ждем');"
   HREF="http://site.com/">Наведите мышь на ссылку и следите за полем статуса</A>

</BODY>

Сразу после загрузки документа в поле статуса будет "Значение по умолчанию". При наведении указателя мыши на ссылку в поле статуса появится надпись "Мышь над ссылкой", при этом URL ссылки ( http://site.com/ ) в поле статуса не появится, т.к. мы подавили его вывод оператором return true.

При убирании указателя мыши со ссылки пользователь бы не успел увидеть строку "Мышь увели со ссылки", поскольку действие по умолчанию (вывод значения defaultStatus в поле статуса) не подавлено (и не может быть подавлено - у обработчика onMouseOut нет такой возможности). Однако мы ввели оператор вывода окна предупреждения alert('Ждем') (он рассматривается ниже) - и теперь пользователь будет видеть в поле статуса строку "Мышь увели со ссылки" до тех пор, пока не нажмет OK в этом окне.

Валерий Банатин
Валерий Банатин

function f() { var i=5; k=7; } f(); alert(k);

В примере выдается результат k=7, однако, хоть переменная и не объявлена, она внутри функции, т.е. локальная и не должна быть видима, или вторая и последующие все-таки становятся глобальными?

Дамир Кантюков
Дамир Кантюков

Изучаю курс введение в JavaScript. 4 уроке есть код, где метод присвоен переменной, почему у меня не работает, браузер гугл:

<HTML><HEAD> <SCRIPT> wid = window.open('','','width=750,height=100,status=yes'); wid.document.open(); R = wid.document.write; R('<HTML><HEAD><SCRIPT>var t;<\/SCRIPT></HEAD>'); R('<BODY><H1>Новое окно</H1></BODY></HTML>'); wid.document.close(); </SCRIPT> </HEAD> <BODY> <A HREF="javascript: wid.t=window.prompt('Новое состояние:',''); wid.document.write(wid.t); wid.focus(); void(0);" >Изменим значение переменной t в новом окне</A> </BODY></HTML>