Содержание
Объектная модель браузера (ОМБ) — множество объектов, которые создает браузер при загрузке страницы. В рамках ОМБ существует еще объектная модель документа (Document Object Model — DOM), она отвечает за сам html документ.
В ОМБ есть несколько объектов. Рассмотрим каждый из них.
Объект браузера — window
Это самый главный объект в объектной модели браузера. Этот объект отвечает за окно браузера. И вся работа с браузером начинается с его окна. Соответственно, если нет окна — нет ничего, т.к. документ, элементы управления (адресная строка, кнопки вперед-назад) загружаются в это окно.
Если в браузере открыта одна вкладка, то создан один объект window, если 2 — 2 объекта, и т.д. Каждый раз, открывая новую вкладку, браузер создает новый объект window.
Чтобы получить объект window, достаточно написать в html документе:
<script type="text/javascript"> window //объект window </script>
А все остальные объекты браузера существуют как свойства объекта window.
Это чисто информационный объект, он дает информацию о самом браузере (название, версия, установленные компоненты). Получить объект navigator можно как одноименное свойство window:
<script type="text/javascript"> window.navigator </script>
Объект браузера — history
Данный объект отвечает за 2 кнопки в окне браузера: ‘вперед’ и ‘назад’. Получается как одноименное свойство объекта window:
<script type="text/javascript"> window.history </script>
Объект браузера — location
Этот объект отвечает за адресную строку в окне браузера. Он позволяет получить адрес страницы, на которой находитесь, и изменить этот адрес. Как только поменяли адресную строку, браузер автоматически осуществляет переход по этому адресу. Получается как свойство объекта window:
<script type="text/javascript"> window.location </script>
Объект браузера — screen
Это информационный объект. Хотя он и является свойством объекта window, но никакого отношения к окну браузера не имеет. Он дает информацию обо всем экране пользователя (разрешение экрана). Получают его так:
<script type="text/javascript"> window.screen </script>
Объект браузера — document
Самый сложный объект браузера, который в свою очередь дает начало объектной модели документа (DOM). Данный объект отвечает за html документ, загруженный в окно браузера. Его получают аналогично:
<script type="text/javascript"> window.document </script>
Объект браузера — event
Объект отвечает за наборы параметров, связанных с событием. Этот объект является свойством объекта window только в IE (internet explore), причем это нестандартное свойство. В других браузерах объект event получают другим способом.
Сейчас для получения вышеперечисленных объектов в коде необязательно обращаться к объекту window (это сделано для удобства разработчиков), достаточно писать так:
<script type="text/javascript"> window.navigator; //раньше писали так navigator; //теперь так event; screen; history; </script>
Другие свойства объекта window
- frames — представляет из себя массив, содержащий объекты window, каждый из которых отвечает за вложенный в это окно фрейм. Как при работе с фреймами, здесь есть общее окно window, которое обладает некоторыми свойствами (например, перемещать окна-фреймы, менять их размеры и ориентацию, закрывать окно). Рассмотрим свойства объекта window внутри frames:
- Свойства, отвечающие за ссылки на другие объекты window: top, parent, opener, self.
- Top — получаем ссылку на главное окно браузера.
- Parent — это ссылка на родителя этого фрейма.
- Self — ‘зацикленная ссылка’ (window.self == window), не имеет никакого смысла.
- Opener — указывает на объект window, на то окно, которое открыло данное (например, у вас было одно окно, вы открыли другое. Тогда opener будет указывать на объект window предыдущего окна).
- Свойства, отвечающие за состояние самого окна.
-
- Closed — свойство типа boolean (true, false). Показывает закрыто окно или нет. Помните, что при закрытии окна объект window не уничтожается, поэтому и допустимо значение true (т.е. окно закрыто, но объект window продолжает существовать).
- DefaultStatus, Status — отвечают за статусную строку браузера. Можно получить, что там написано, или написать что-то. Сейчас не советую менять статусную строку. Пример (выведет дату и время в статусной строке):
function DefaultStatus(){ var d=new Date(); //создали объект windows.defaultStatus=d.toLocaleString(); //преобразуем в строку defaultStatus=d.toLocaleString();} //можно так без window
- Name — внутреннее имя окна. Предназначено только для разработчиков, пользователь его не видит.
- ReturnValue — предназначено для обмена информацией между окнами. Например, одно окно открывает другое, в другом окне пользователь что-то делает, нажимает кнопку; и нужно передать информацию из одного окна в другое. Окна могут взаимодействовать между собой через объекты window.
Методы объекта window
- Методы ввода-вывода информации
-
- alert () — выводит окно. В браузере Mozilla alert появляется в центре окна, а в IE — в центре экрана, вне зависимости где находится окно.
function Alert(){ alert("hello");}
-
- confirm () — выводит окно с вопросом: ‘да’ или ‘нет’ (‘ok’ и ‘chancel’). Возвращает соответственно true или false.
var a=confirm("This is a cat?"); alert(a);
-
- prompt () — выводит информацию на страницу.
var a=prompt("подсказка", "default"); alert(a);
- Открытие — закрытие — печать окон.
-
- open () — можно из одного окна открыть другое окно. Его параметры: адрес страницы, которую надо открыть; внутренне имя окна, которое хотите ему присвоить; набор свойств открываемого окна (location, width, height, menubar, toolbar, scrollbars).
open("http://phpmove.ru"); //можно с одним параметром open("http://phpmove.ru","site","width=150"); //можно с 3 параметрами
-
- close () — закрывает окно. Без параметров. При закрытии выскакивает предупреждение браузера из соображений безопасности.
close();
- print () — имитирует нажатие кнопки ‘печать’. Выскакивает окно выбора принтера и предложение распечатать текущий документ. Без параметров.
- focus () — передать фокус окну, т.е. выводит окно на передний план. Без параметров.
- blur () — убрать фокус у окна, уводит окна браузера на задний план, под все открытые окна. Без параметров.
- Методы для управления открытым окном — положение и размеры окна.
-
- moveTo (), moveBy () — двигает окно на экране в заданные координаты (указываются координаты левого верхнего угла); смещение относительно левого верхнего угла.
moveTo(10,20); mobeBy(10,20); //смещение относительно текущего левого верхнего угла
-
- resizeTo (), resizeBy () — задает размер окна; увеличивает размер окна на указанное число пикселей по горизонтали и вертикали.
resizeTo(500,500); //задает размер окна resizeBy(10,20); //увеличивает размер окна
-
- scrollTo (), scrollBy () — прокручивает содержимое окна. 1-й параметр — прокрутка слева направо, 2 — сверху-вниз. scrollBy — прокручивает на указанное число пикселей относительно текущего положения. Данные методы используются редко, т.к. здесь для прокрутки используются пиксели, а сама страница может масштабироваться по процентам, и тогда получится некрасиво.
scrollTo(10,20); //просто прокрутка scrollBy(11,12); //относительно текущего положения