Окружение: dom,boMиJs
Браузер дает доступ к иерархии объектов, которые мы можем использовать для разработки.
На рисунке схематически отображена структура основных браузерных объектов.
Объектная модель документа (DOM)
Доступна через document. Дает доступ к содержимому страницы.
На странице W3C DOMвы можете найти стандарты DOM, разработанные самим W3C. На данный момент существует 3 уровня DOM. Современные браузеры также поддерживают некоторые возможности, которые называются DOM 0 и которые остались еще с той эпохи, когда не было W3C.
Объектная модель браузера (BOM)
BOM — это объекты для работы с чем угодно, кроме документа.
Доступ к фреймам, запросы к серверу, функции alert/confirm/prompt —- все это BOM.
Большинство возможностей BOM стандартизированы в HTML5, но браузеры любят изобрести что-нибудь своё, особенное.
Объекты и функции JavaScript
Javascript — связующий все это язык. Встроенные в него объекты и сам язык в идеале должны соответствовать стандарту ECMA-262, но пока что браузеры к этому не пришли. Хотя положительная тенденция есть.
Bom-объекты:navigator,screen,location,frames navigator: платформа и браузер
Объект navigator содержит общую информацию о браузере и операционной системе. Особенно примечательны два свойства:
navigator.userAgent — содержит информацию о браузере.
navigator.platform — содержит информацию о платформе, позволяет различать Windows/Linux/Mac и т.п..
Для вашего браузера значения:
alert(navigator.userAgent);
alert(navigator.platform);
screen
Объект screen содержит общую информацию об экране, включая его разрешение, цветность и т.п. Оно может быть полезно для определения, что код выполняется на мобильном устройстве с маленьким разрешением.
Текущее разрешение экрана посетителя по горизонтали/вертикали находится в screen.width/screen.height.
Разрешение у вас сейчас: 1440 x 900
Это свойство можно использовать для сбора статистической информации о посетителях.
JavaScript-код счетчиков считывает эту информацию и отправляет на сервер. Именно поэтому можно просматривать в статистике, сколько посетителей приходило с каким экраном.
Location
Объект location предоставляет информацию о текущем URL и позволяет JavaScript перенаправить посетителя на другой URL. Значением этого свойства является объект типа Location.
Методы и свойства Location
Самый главный метод — это, конечно же, toString. Он возвращает полный URL.
Следующая кнопка выведет текущий адрес:
alert(window.location)
Код, которому нужно провести строковую операцию над location, должен сначала привести объект к строке. Вот так будет ошибка:
// будет ошибка, т.к. location - не строка
alert( window.location.indexOf('://') );
А так – правильно
// привели к строке перед indexOf
alert( (window.location + '').indexOf('://') );
Все следующие свойства являются строками. Колонка «Пример» содержит их значения для тестового URL:
http://www.google.com:80/search?q=javascript#test
|
Свойство |
Описание |
Пример |
|
hash |
часть URL, которая идет после символа решетки ‘#’, включая символ ‘#’ |
#test |
|
host |
хост и порт |
www.google.com:80 |
|
href |
весь URL |
http://www.google.com:80/search?q=javascript#test |
|
hostname |
хост (без порта) |
www.google.com |
|
pathname |
строка пути (относительно хоста) |
/search |
|
port |
номер порта (если порт не указан, то пустая строка) |
80 |
|
protocol |
протокол |
http: (двоеточие на конце) |
|
search |
часть адреса после символа "?", включая символ "?" |
?q=javascript |