Об'єктна модель браузера (анг. Browser Object Model (BOM)) - це частина JavaScript, яка дозволяє скрипту взаємодіяти з програмою перегляду веб-сторінок. BOM представляє об'єкти, через властивості і методи яких можна керувати зовнішнім виглядом і поведінкою оглядача.
Об'єктна модель браузера в якості компонента JavaScript з'явилася в браузері Netscape Navigator 2.0 в 1996 році. У тому ж році Microsoft представила Internet Explorer 3.0 з власною версією JavaScript - JScript і власною моделлю BOM. Обидва браузера підтримували приблизно однаковий набір об'єктів, які стали основою DOM 0 (legacy DOM) і наступних специфікацій об'єктної моделі документа. Появівішіеся пізніше різноманітні браузери , Що підтримують JavaScript, також представляють більш-менш однакові об'єкти BOM, але офіційних стандартів цієї моделі (на відміну від DOM) так і не з'явилося до теперішнього часу.
Місце BOM в структурі JavaScript - в умовній середині між системним компонентом (core) і моделлю документа (рис. 1).
Мал. 1. Об'єктна модель браузера в структурі JavaScript
Основні об'єкти BOM і зв'язку між ними наведені на рис. 2. Слід зазначити, що об'єкт document, з якого починається ієрархія DOM, сам є частиною моделі браузера.
Мал. 2. Об'єкти браузера
Об'єкти BOM: особливості реалізації
Розглянемо особливості реалізації деяких об'єктів BOM в різних браузерах (актуальних на момент написання статті) на кількох прикладах. Відразу відзначимо, що основні відмінності виявляються у властивостях і методах об'єктів. Отже:
window - об'єкт, який підтримується всіма програмами перегляду, представляє вікно браузера. Корінь ієрархії BOM, через який здійснюється доступ до всіх інших об'єктів JavaScript. приклад:
// window.open (URL, name [, args]) - відкриває нове вікно. // Поведінка відкривається вікна залежить від браузера і списку параметрів (args). // Читати дослідження . var newwindow = window.open ( "example.com", "sample");window.document - представляє доступ до всіх елементів HTML гіпертекстового документа, завантаженого в заданий вікно. Підтримується всіма браузерами. приклади:
document.getElementById ( "outbox"). innerHTML = "<h2> Hello! </ h2>"; var x = document.getElementsByTagName ( "p"); var y = x.getElementsByClass ( "asH2");Перевірити отлтічія в реалізації об'єкта document в різних браузерах можете самостійно, за допомогою цього простого скрипта:
<Script type = "text / javascript"> for (k in document) document.write ( "<p> document." + K + ": <b>" + document [k] + "</ b> </ p> "); </ Script>window.history - управляє історією перегляду веб-сторінок. Для переміщення по журналу перегляду використовуються методи back, forward, go:
// поверне на попередню переглянуту сторінку // працює у всіх браузерах window.history.back (); // або var n = -1; window.history.go (n); // але! var URL = "example.com"; window.history.go (URL); // працює тільки в Internet ExplorerДетальний опис об'єктних моделей конкретних браузерів можна знайти на сторінках розробників (див. Наприклад Mozilla , Internet Explorer )
BOM: кроссбраузерность
Наведених вище прикладів досить, щоб переконатися, що повної сумісності між браузерами немає як не було, та й навряд чи вона коли-небудь буде досягнута. цей відгомін браузерних воєн все також вимагає від розробників написання скриптів з урахуванням особливостей популярних браузерів, особливо коли виникає необхідність змінити поведінка не документа, а самої програми-оглядача.
Кілька полегшити задачу розробки кліентсткую веб-додатків з урахуванням специфіки різних браузерів дозволяє використання кросбраузерності бібліотек на JavaScript. Один із прикладів - скрипт $ B, розроблений С.Чапменом (Stephen Chapman) і дозволяє управляти позиціонуванням і розмірами вікна браузера. Ще приклад бібліотеки того ж автора - скрипт $ E для управління подіями (events). Знайти ці скрипти можна за запитом « modular script library ».
Ще приклади кросбраузерності рішень - це бібліотеки jQuery і Bootstrap. І хоча вони орієнтовані в першу чергу на роботу з об'єктами документа, звернення до об'єктів браузера там широко використовуються.
Постійна адреса цієї сторінки: