Javascript объект window navigator название браузера. Объекты navigator, screen и location - Информация о браузере и разрешении экрана - Текущий URL

Объект 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

appName

Возвращает имя программы 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

onLine

Возвращает 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)

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

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

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

var any ;

/* Цикл по свойствам для объекта navigator */
for(any in navigator )
{
document .write (any + "
" );
}

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

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

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

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

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

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

document .write ("Название браузера: " + navigator .userAgent + "
" );
document .write ("Язык браузера: " + navigator .language + "
" );
document .write ("Название ОС: " + navigator .oscpu + "
" );
document .write ("Включены ли куки: " + navigator .cookieEnable d + "
" );
document .write ("Подключение к сети: " + navigator .onLine + "
" );

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

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

var any ; /* Произвольная переменная */

/* Цикл по свойствам для объекта screen */
for(any in screen )
{
document .write (any + "
" );
}

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

document .write ("Высота экрана: " + screen .height + "px
" );
document .write ("Ширина экрана: " + screen .width + "px
" );

document .write ("Глубина цвета: " + screen .colorDepth + "
" );

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

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

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

var any ; /* Произвольная переменная */

/* Цикл по свойствам для объекта location */
for(any in location )
{
document .write (any + "
" );
}

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

document.write ("URL-адрес: " + location .href ) ;

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

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

Если 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

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

var browsers = navigator .userAgent ; /* Информация о текущем браузере */

/* Составляем регулярные выражения для поиска совпадений в данных о браузере */
var regV_1 = /firefox/ i ; /* i - регистронезависимый шаблон */
var regV_2 = /chrome/ i ;
var regV_3 = /opr/ i ;

/* Составляем условия */
if (browsers .match (regV_1 ) != null )
{
document.write ("Ваш браузер - Firefox" );
}

/* Здесь учитываем, что Chrome присутствует в описании для Opera */
else if(browsers .match (regV_2 ) != null && browsers .match (regV_3 ) != "OPR" )
{
document.write ("Ваш браузер - Chrome ");
}

else if(browsers .match (regV_3 ) != null )
{
document.write ("Ваш браузер - Opera" );
}

else
{
document.write ("Вы используете НЕ известный браузер" );

Источник: http://learn.javascript.ru/browser-objects

navigator: платформа и браузер

Объект navigator содержит общую информацию о браузере и операционной системе. Особенно примечательны два свойства:

• navigator.userAgent — содержит информацию о браузере.
• navigator.platform — содержит информацию о платформе, позволяет различать Windows/Linux/Mac и т.п..

alert(navigator.userAgent); alert(navigator.platform); screen

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

Текущее разрешение экрана посетителя по горизонтали/вертикали находится в screen.width / screen.height .

Это свойство можно использовать для сбора статистической информации о посетителях.

JavaScript-код счетчиков считывает эту информацию и отправляет на сервер. Именно поэтому можно просматривать в статистике, сколько посетителей приходило с каким экраном.

location

Объект location предоставляет информацию о текущем URL и позволяет JavaScript перенаправить посетителя на другой URL. Значением этого свойства является объект типа Location .

Методы и свойства Location

Самый главный метод — это, конечно же, toString . Он возвращает полный URL.

Код, которому нужно провести строковую операцию над location, должен сначала привести объект к строке. Вот так будет ошибка:

// будет ошибка, т.к. location - не строка alert(window .location.indexOf("://" ));

А так - правильно:

// привели к строке перед indexOf alert((window .location + "" ).indexOf("://" ));

Все следующие свойства являются строками. Колонка «Пример» содержит их значения для тестового URL:

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

assign(url) загрузить документ по данному url. Можно и просто приравнять window.location.href = url .

reload() перезагрузить документ по текущему URL. Аргумент forceget - булево значение, если оно true, то документ перезагружается всегда с сервера, если false или не указано, то браузер может взять страницу из своего кэша.

replace(url) заменить текущий документ на документ по указанному url.

toString() Возвращает строковое представление URL.

При изменении любых свойств window.location , кроме hash , документ будет перезагружен, как если бы для модифицированного url был вызван метод window.location.assign() .

Можно перенаправить и явным присвоением location , например:

// браузер загрузит страницу http://javascript.ru window .location = "http://javascript.ru" ; frames

Коллекция, содержащая фреймы и ифреймы. Можно обращаться к ним как по номеру, так и по имени.

В frames содержатся window-объекты дочерних фреймов. Следующий код переводит фрейм на новый URL:

window .frames.example.location = "http://example.com" ; history

Объект history позволяет менять URL без перезагрузки страницы (в пределах того же домена) при помощи History API , а также перенаправлять посетителя назад-вперед по истории.

Объект history не предоставляет возможности читать историю посещений. Можно отправить посетителя назад вызовом history.back() или вперед вызовом history.forward() , но сами адреса браузер не дает из соображений безопасности.

Итого

Браузерные объекты:

• navigator, screen Содержат информацию о браузере и экране.
• location Содержит информацию о текущем URL и позволяет её менять. Любое изменение, кроме hash , перегружает страницу. Также можно перегрузить страницу с сервера вызовом location.reload(true) .
• frames Содержит коллекцию window-объектов для каждого из дочерних фреймов. Каждый фрейм доступен по номеру (с нуля) или по имени, что обычно удобнее.
• history Позволяет отправить посетителя на предыдущую/последующую страницу по истории, а также изменить URL без перезагрузки страницы с использованием History API.

Поле адреса в браузере обычно располагается в верхней части окна и отображает 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 . Важнейшие из свойств этого объекта перечислены ниже.

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