Javascript объект window navigator название браузера. Программируем свойства окна браузера. Методы объекта location

Поле адреса в браузере обычно располагается в верхней части окна и отображает URL загруженного документа. Если пользователь хочет вручную перейти к какой-либо странице (набрать ее URL), он делает это в поле адреса.

Рис. 4.2.

Свойство location объекта window само является объектом класса Location . Класс Location , в свою очередь, является подклассом класса URL , к которому относятся также объекты классов Area и Link . Объекты Location наследуют все свойства объектов URL , что позволяет получить доступ к любой части схемы URL . Подробнее о классе объектов URL мы расскажем в "Программируем гипертекстовые переходы" .

В целях совместимости с прежними версиями JavaScript, в языке поддерживается также свойство window.document. location , которое в настоящее время полностью дублирует свойство window. location со всеми его свойствами и методами. Рассмотрим теперь свойства и методы объекта window. location (событий, связанных с этим объектом, нет).

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

Их проще продемонстрировать на примере. Предположим, что браузер отображает страницу, расположенную по адресу:

Тогда свойства объекта location примут следующие значения:

window.location.href = "http://www.site.ru:80/dir/page.cgi?product=phone&id=3#mark" window.location.protocol = "http:" window.location.hostname = "www.site.ru" window.location.port = 80 window.location.host = "www.site.ru:80" window.location.pathname = "dir/page.cgi" window.location.search = "?product=phone&id=3" window.location.hash = "#mark"

Как уже говорилось в предыдущих лекциях, к свойствам объектов можно обращаться как с помощью точечной нотации (как выше), так и с помощью скобочной нотации , например: window. location [" host "] .

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

Методы объекта location предназначены для управления загрузкой и перезагрузкой страницы. Это управление заключается в том, что можно либо перезагрузить текущий документ (метод reload () ), либо загрузить новый (метод replace () ).

window.location.reload(true);

Метод reload () полностью моделирует поведение браузера при нажатии на кнопку Reload в панели инструментов. Если вызывать метод без аргумента или указать его равным true , то браузер проверит время последней модификации документа и загрузит его либо из кеша (если документ не был модифицирован), либо с сервера. Такое поведение соответствует простому нажатию кнопки Reload браузера (клавиши F5 в Internet Explorer ). Если в качестве аргумента указать false , то браузер перезагрузит текущий документ с сервера, несмотря ни на что. Такое поведение соответствует одновременному нажатию клавиши Shift и кнопки браузера Reload (или Ctrl+F5 в Internet Explorer ).

Используя объект location , перейти на новую страницу можно двумя способами:

window.location.href="http://www.newsite.ru/"; window.location.replace("http://www.newsite.ru/");

Разница между ними - в отображении этого действия в истории посещений страниц window. history . В первом случае в историю посещений добавится новый элемент, содержащий адрес " http://www.newsite.ru/ ", так что при желании можно будет нажать кнопку Back на панели браузера, чтобы вернуться к прежней странице. Во втором случае новый адрес " http://www.newsite.ru/ " заместит прежний в истории посещений, и вернуться к прежней странице нажатием кнопки Back уже будет невозможно.

История посещений (history)

История посещений страниц World Wide Web позволяет пользователю вернуться к странице, которую он просматривал ранее в данном окне браузера. История посещений в JavaScript трансформируется в объект window. history . Этот объект указывает на массив URL-страниц, которые пользователь посещал и которые он может получить, выбрав из меню браузера режим Go. Методы объекта history позволяют загружать страницы, используя URL из этого массива.

Чтобы не возникло проблем с безопасностью браузера, путешествовать по History можно, только используя индекс. При этом URL, как текстовая строка, программисту недоступен. Чаще всего этот объект используют в примерах или страницах, на которые могут быть ссылки из нескольких разных страниц, предполагая, что можно вернутся к странице, из которой пример будет загружен:

Данный код отображает кнопку "Назад", нажав на которую, мы вернемся на предыдущую страницу. Аналогичным образом действует метод history . forward () , перенося нас на следующую посещенную страницу.

Существует также метод go() , имеющий целочисленный аргумент и позволяющий перескакивать на несколько шагов вперед или назад по истории посещений. Например, history .go(-3) перенесет нас на 3 шага назад в истории просмотра. При этом методы back() и forward () равносильны методу go() с аргументами -1 и 1 , соответственно. Вызов history .go(0) приведет к перезагрузке текущей страницы.

Тип браузера (navigator)

Часто возникает задача настройки страницы на конкретную программу просмотра (браузер). При этом возможны два варианта: определение типа браузера на стороне сервера, либо на стороне клиента. Для последнего варианта в арсенале объектов JavaScript существует объект window. navigator . Важнейшие из свойств этого объекта перечислены ниже.

Рассмотрим простой пример определения типа программы просмотра.

Объект navigator содержит информацию о браузере пользователя (в частности - доступно ли использование cookie файлов и включена ли поддержка Java ).

Также объект navigator позволяет определить тип операционной системы.

Для удобства работы с объектом navigator выведем все его свойства на экран. Вспоминаем материал из предыдущего урока .

Информацию о браузере - свойство userAgent ;

Язык браузера - свойство language ;

Название операционной системы - свойство oscpu ;

Включены ли куки - свойство cookieEnable d;

Подключен ли пользователь к сети Интернет - свойство onLine .

Доступ к свойствам объекта navigator осуществляется через точку.

Объект screen поможет получить данные о разрешении экрана пользователя, о глубине цвета и др.

С объектом screen поступим аналогично: сначала выведем на экран все его свойства.

Теперь при помощи свойств height и width объекта screen получим информацию: о разрешении экрана - его высоте и ширине в пикселях. А также о битовой глубине цветовой палитры - свойство colorDepth .

Объект location возвращает URL-адрес текущего окна пользователя.

А также содержит данные о частях и компонентах текущего адреса: имя хоста, номер порта, протокол и т.д.

Свойства объекта location .

Воспользуемся свойством href объекта location , чтобы вывести на экран URL-адрес текущего документа.

Выполним домашнее задание по этому уроку.

Выясните, с какого браузера человек зашел на вашу страничку и, в зависимости от браузера, выведите на экран:

Если firefox: "Ваш браузер Firefox."
Если opera: "Ваш браузер Opera."
Если chrome: "Ваш браузер Chrome."

Для решения этого домашнего задания нужно :

При помощи свойства userAgent объекта navigator получить информацию о текущем браузере.

На момент решения этой задачи я получил следующие данные о браузерах Firefox , Opera и Chrome .

Mozilla/5.0 (Windows NT 6.1; WOW64; rv:56.0) Gecko/20100101 Firefox /56.0

Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome /61.0.3163.100 Safari/537.36 OPR /48.0.2685.39

Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome /61.0.3163.100 Safari/537.36

При помощи регулярных выражений найти названия браузеров из информации о них .

Объект location

Отвечает за адресную строку. Позволяет получить и изменить адрес страницы. Как только адрес меняется, браузер автоматически переходит по новому адресу. Т.е. можно сымитировать переход по адресу.

Есть свойства :

• hash - метка.
• host - hostname + port.
• hostname – это www и.ru в адресе сайта.
• href - содержит адресную строку. Здесь можно написать другой адрес, и браузер перейдет по этому адресу.
• pathname – сама страница.
• port - используемый пост.
• protocol - это http:// или ftp://.
• search – параметры после знака вопроса.

Есть методы :

• assign () - переход по указанному адресу.
• reload () - имитация нажатия кнопки ‘обновить’.
• replace () – переход по указанному адресу, но на открытой странице нет кнопки назад, т.е. не сохраняет данную страницу в истории.

Объект screen

Это чисто информационный объект. Он сообщает размер экрана пользователя в пикселях. У него нет методов, есть только свойства:

• availHeight – доступная высота экрана.
• availWidth – доступная ширина экрана.
• colorDepth – количество битов, отводимое для хранения цветов (сейчас не используется).
• height - высота экрана пользователя.
• width - ширина экрана пользователя.
• updateInterval - частота обновления экрана ЭЛТ (не используется).

Объект navigator

Объект navigator служит для доступа к самой программе Web-обозревателя. Не путайте его с объектом window , представляющем текущее окно Web-обозревателя, и названием программы Netscape Navigator.

appCodeName

Возвращает имя кода программы Web-обозревателя. И для Internet Explorer, и для Navigator вернет строку "Mozilla".

appMinorVersion

Возвращает младшую цифру номера версии программы Web-обозревателя. Например, для Internet Explorer 5.0 вернет "0", а для 5.5 - "5".

Поддерживается только Internet Explorer начиная с 4.0

Возвращает имя программы Web-обозревателя, например, "Netscape" или "Microsoft Internet Explorer".

appVersion

Возвращает версию программы Web-обозревателя.

browserLanguage

Возвращает код программы Web-обозревателя.

cookieEnabled

Возвращает true, если Web-обозревателю разрешен пользователем прием cookie. Поддерживается только IE начиная с 4.0

cpuClass

Возвращает класс процессора клиентского компьютера, например, "x86" или "Alpha". Поддерживается только IE начиная с 4.0

language

Возвращает код языка программы Web-обозревателя. Поддерживается только NN начиная с 4.0

Возвращает true, если клиент в настоящее время подключен к интернету (находится в режиме on-line), и false, если отключен (off-line).

Поддерживается только IE начиная с 4.0

platform

Возвращает название клиентской платформы, например, "Win32".

systemLanguage

Возвращает код языка операционной системы клиента. Поддерживается только IE начиная с 4.0

userAgent

Возвращает строку, идентифицирующую Web-обозреватель клиента. Является комбинацией значений свойств appCodeName и appVersion.

userLanguage

То же самое, что browserLanguage.

Поддерживается только IE начиная с 4.0

Объект navigator поддерживает, кроме того, метод javaEnabled() , возвращающий true, если Web-обозревателю разрешено пользователем выполнение сценариев JavaScript.

Немного более подробно хотелось бы сказать о свойстве appVersion , а точнее о возвращаемом им значении. Все дело в том, что у IE и NN оно будет разным.

Вот какой формат будет у Navigator:

{Версия} [{Язык}] ({Операционная система}; U|I)

Здесь {Версия} представляет собой версию Web-обозревателя, {Язык} - язык программы (но может и отсутствовать), {Операционная система} - обозначение операционной системы клиента, например, "Win96", "Win16" или "WinNT", буква "U" - американскую версию программы, а "I" - интернациональную.

Например:

4.0 (Win95; I)

У Internet Explorer формат вывода значений свойства appVersion другой:

{Совместимая версия Navigator} (compatible; {Версия}; {Операционная система})

Здесь {Операционная система} может принимать значения "Windows 3.1", "Windows 3.11", "Windows 95" или "Windows NT".

2.0 (compatible; 3.01; Win95)

Свойство userAgent возвращает значение, имеющее формат:

{Значение appCodeName}/{Значение appVersion}

То есть, для двух предыдущих примеров мы получим следующие значения:

Mozilla/4.0 (Win95; I)Mozilla/2.0 (compatible; 3.01; Win95)