JavaScript и объектная модель

Скриптовые языки в некотором роде перевернули мир, и именно благодаря им появился DHTML, который позволяет делать со страничкой практически что-угодно. Как известно, всего два языка претендуют на лавры победителя в броузере. Это VBScript - подмножество Visual Basic-а и JavaScript. Вот последним мы и займёмся как наиболее универсальным.

Сами по себе изучать скриптовые языки не имеет смысла, т.к. они тесно связаны с объектной моделью броузера и, по сути дела, большая часть скриптов просто устанавливает соответствующие свойства объектов или вызывает их методы.

Что такое объектная модель?

Давным-давно, когда броузеры ещё имели номер версии равный единице, ничего подобного не было и в помине. Информация просто выводилась на дисплей по мере поступления, не подвергаясь никаким изменениям. Всё было просто, и даже глюков совместимости ещё не было :).

Сейчас же путь странички до дисплея гораздо дольше. Давайте поэтапно проследим её путь:

1. Страничка скачивается с сайта и размещается в памяти компьютера;
2. Производится анализ странички, в результате которого она препарируется на составляющие;
3. Блоки, из которых состоит страничка, размещаются во временной базе данных соответственно структуре объектной модели;
4. База данных становится доступной другим программам и, в-частности, рендеру, который выводит страничку на экран. Для доступа и управления содержимым этой базы данных броузер предоставляет нам механизм объектов и скриптовый язык, посредством которого и выполняется доступ.

Разумеется, содержимое базы может быть изменено до вывода на экран, что и позволяет работать DHTML. Но объектная модель остаётся работать даже после того, как страничка показана на экране дисплея. Это даёт нам возможность в небольших пределах (а в последних версиях HTML 4.0 практически полностью) менять содержимое странички после загрузки.

Структура объектной модели

Чтобы было понятно, о чём мы говорим, рассмотрим общую структуру объектной модели. Ниже приведена объектная модель Internet Explorer-а версии 4 и выше:

• window - объект, дающий доступ к окну броузера
• frames - объект, дающий доступ к фреймам
  • window...
  • window...
  • ...
• document - объект, содержащий в себе всю страничку
  • all - полная коллекция всех тегов документа
  • forms - коллекция форм
  • anchors - коллекция якорей
  • appleеs - коллекция апплетов
  • embeds - коллекция внедренных объектов
  • filters - коллекция фильтров
  • images - коллекция изображений
  • links - коллекция ссылок
  • plugins - коллекция подключаемых модулей
  • scripts - коллекция блоков
  • selection - коллекция выделений
  • stylesheets - коллекция объектов с индивидуально заданными стилями
• history - объект, дающий доступ к истории посещенных ссылок
• navigator - объект, дающий доступ к характеристикам броузера
• location - объект, содержащий текущий URL
• event - объект, дающий доступ к событиям
• screen - объект, дающий доступ к характеристикам экрана

Объектная модель Netscape Navigator-а немного отличается от вышеприведённой, но её смысл точно такой же. А использование JavaScript позволяет нам обойти различия в реализации объектных моделей.

Вместо того, чтобы подробно объяснять каждый объект, входящий в модель броузера, я буду разъяснять смысл соответствующих объектов, их свойств и методов на конкретных примерах по мере возникновения в том необходимости.

Как видите, структура объектной модели достаточно сложна, но строго определена, и существует однозначный способ доступа к любому свойству или методу. Синтаксис полностью соответствует тому, что используется в объектных языках. Т.е. нижележащие объекты отделяются от вышележащих точкой, и для доступа к конкретному свойству нужно просто корректно построить строку доступа.

И, как Вы понимаете, вот здесь-то на сцену и выходит скриптовый язык, который и позволяет нам манипулировать объектами.

Как любой язык программирования, JavaScript имеет определённый набор типов переменных, операторов, встроенных функций и объектов. Изучение JavaScript как такового как раз и заключаются в запоминании всего этого. Но, как Вы понимаете, оторванный от объектной модели, он мало полезен сам по себе. А потому я просто расскажу о популярных эффектах, применяемых на страничках, попутно давая пояснения. И надеюсь, что если это Вас заинтересует, то более сложные вещи Вы уже напишете сами.