Отправляет email-рассылки с помощью сервиса Sendsay

Программирование на JavaScript: просто о сложном.

Рассылка закрыта

При закрытии подписчики были переданы в рассылку "Всё о работе в Интернет" на которую и рекомендуем вам подписаться.

Вы можете найти рассылки сходной тематики в Каталоге рассылок.

←   Февраль 2006   →
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
Автор
Владимир

Статистика

1.761 подписчиков
0 за неделю
←   Все выпуски   →

Программирование на JavaScript: просто о сложном. Вып 15


Информационный Канал Subscribe.Ru

ГЛАВНАЯ     УЧ ЕБНИК     СК РИПТЫ     1000 СКРИПТОВ     Все о Яваскрипт-скачать     Сс ылки    



Наши партнеры:


Б есплатный курс лекций по FOREX

Воспоминания биржевых трейдеров.
На сайте собраны воспомин ания, секреты и рекомендации таких известных биржевых трейдеров современности, как Дж.Сорос, Д.Швагер, Б.Льюис и многих других.


ВЫПУСК 15


Объектная модель языка JavaScript

При создании HTML-документов и JavaScript-программ необходимо учитывать структуру объектов. Все объекты можно разделить на три группы:
  1. Объек ты браузера
  2. Внутренние, или встроенные, объекты языка JavaScript
  3. Объекты, связанные с тегами языка HTML
Объектами браузера являются зависимые от браузера объекты: window (окно), location (местоположение) и history (история). Внутренние объекты включают простые типы дан ных, такие как строки (string), математические константы (math), дата (date) и другие.
Объекты, связанные с тегами HTML, соответствуют тегам, которые формируют текущий документ. Они вк лючают такие элементы как гиперсвязи и формы.

Методы объектов

С объектами связ аны методы, которые позволяют управлять этими объектами, а также в некоторых случаях менять их содержи мое. Кроме того в языке JavaScript имеется возможность создавать свои методы объектов. При использовании метода объекта, нужно перед именем метода указать имя объекта к которому он принадлежит. Например, прав ильным обращением к методу document является выражение document.write(), а просто выраж ение write() приведет к ошибке.

Свойства объектов языка JavaScript

В объектн о-ориентированном программировании используется также термин свойство. Свойство - это име нованное значение, которое принадлежит объекту. Все стандартные объекты языка JS имеют свойства. Напри мер, в прошлой главе мы использовали в одном из примеров свойство bgColor объекта document. данн ое свойство соответствует атрибуту bgColor тега <body> - цвет фона документа. Для обр ащения к свойству необходимо указать имена объекта и свойства, разделив их точкой. Каждый объект имеет со бственный набор свойств. Набор свойств нового объекта можно задать при определении объекта. Однако, нек оторые свойства объктов существуют только для чтения, и вы не можете их менять. В таких случаях можно пол учить только значения этих свойств. Как показывает практика, такие свойства изменять обычно без надобности и проблем в связи с этим не возникает.

Объекты браузеров

Браузеры поддерживают о бъекты различных типов. HTML-объектами являются объекты, которые соответствуют тегам языка HTML. К ним относятся метки, гиперсвязи и элементы формы - текстовые поля, кнопки, списки и др. Объекты верхнего уровн я, или объекты браузера, - это объекты, поддерживаемые в среде браузера: window, location, history, document, navigator. Объекты, перечисленные в таблице, создаются автоматически при загрузке документа в браузер.

Имя объекта
Описание
windowОбъект верхнего ур овня в иерархии объектов языка JavaScript. Фреймосодержащий документ также имеет объект window.
documentСодержит свойства, которые относятся к текущему HTML-документу, наприм ер имя каждой формы, цвета, используемые для отображения документа, и др. В языке JS большинству HTML- тегов соответствуют свойства объекта document.
locationСодержит свойства, описывающие местонахождение текущего документа, например адрес URL.
navigatorСодержит информацию о версии браузера. Свойства данного объекта обычно только для чтения. Нап ример свойство: navigator.appname содержит строковое значение имени браузера.
historyСодержит информацию обо всех ресурсах, к которым пользователь обращался во время текущего сеанса работы с браузером.


Рассмотрим более подр обно каждый объект.

Объект window

Объект window обычно соответствует главному ок ну браузера и является объектом верхнего уровня в языке JavaScript, поскольку документы, собственно, и отк рываются в окне. В фреймосодержащих документах, объект window может не всегда соответствовать главному окну программы. Поэтому для обращения к конкретному окну следует использовать свойство frames объекта parent. Фреймы - это те же окна. Чтобы обратиться к ним в языке JavaScript, можно использовать массив frames. Например, выражение parent.frames[0] обращается к первому фрейму окна браузера. Предполагается, что такое окно существует, но при помощи метода window.open() можно открывать и д ругие окна и обращаться к ним посредством свойств объекта window.

Для обращенния к методам и с войствам объекта window используют следующие варианты записи:

    • window. propertyName
    • window.methodName (parameters)
    • self.propertyName
    • self.methodName (parameters)
    • top.propertyName
    • top.methodName (parameters)
    • parent.propertyName
    • parent.methodName ( parameters)
    • windowVar.propertyName
    • windowVar.methodName (parameters)
    • propertyName
    • methodName (parameters)
Здесь windowVar - экземпляр объекта window. Имя self - синоним, используемый для обращения к текущему окну во фреймосо держащем документе, тогда как имя top применяется для обращения к главному окну браузера. Для этой цели можно применить и объект parent. Однако следует иметь в виду, что значением parent явл яется ссылка на родительское окно, когда top - ссылка на окно верхнего уровня, которое содержит либо данный фрейм, либо фрейм содержащий вложенный фрейм. Обращение напрямую к методам и свойствам воз можно при использовании оператора with.

Свойства

Объект window< /B> имеет свойства:
    • defaultStatus - текстовое сообщение, которое по умолчанию вы водится в строке состояния (status bar) окна браузера.
    • frames - массив фреймов во фреймосодерж ащем документе.
    • length - количество фреймов во фреймосодержащем документе.
    • name - заголовок окна, который задается с помощью аргумента windowName метода open().
    • parent - синоним, используемый для обращения к родительскому окну.
    • self - синоним, используемый для обращения к текущему окну.
    • status - текст временного сообщения в строке состо яния окна браузера.
    • top - синоним, используемый для обращения к главному окну браузера.
    • window - синоним, используемый для обращения к текущему окну.


Методы

Метод alert() применяется для того, чтобы вывести на экран текстовое сообщение. Для отк рытия окна используется метод open(), а для закрытия - метод close(). С помощью метода confirm() происходит вывод на экран окна сообщения с кнопками Yes и No, и возвраща ет булевое значение true или false, в зависимости от нажатой кнопки. Посредством метода prompt() на экран выводится диалоговое окно с полем ввода. Метод setTimeout() устан авливает в текущем окне обработку событий, связанных с таймером, а метод clearTimeout() отменяет обработку таких событий.

Обработчики событий

Объект window не обрабатывает собы тия до тех пор, пока в окно не загружен документ. Однако можно обрабатывать события, связанные с загрузкой и выгрузкой документов. Обработчики таких событий задаются как значения атрибутов onLoad и onUnload, определяемых в теге <body>. Эти же атрибуты могут быть определены в тегах <frameset> фреймосодержащих документов.

пример:

Мы хотим загрузить, например, страницу http://my.site.ru в окно размером в 640х480 пикселов:

myWin = open ("http://my.site. ru",
"myWin",
"width=640, height=480");
Закрыть это окно можно из любого другого окна используя:
myWin.close();

Объект document

Объект document соответствует всему ги пертекстовому документ, вернее, той его части, которая заключена в контейнер <body> . . . </ body>. Документы отображаются в окнах браузера, поэтому каждый из них связан с определенным о кном. Все HTML-объекты являются свойствами объекта document, поэтому они находятся в самом док ументе. Например, в языке JS к первой форме документа можно обратиться, используя выражение:

document.forms[0]

в то время как к первой форме во втором фрейме следует обращаться выражени ем:

parent.frames[1].document.forms[0]

Объект document удобно использовать для динамиче ского создания HTML-документов. Для этого применяется HTML-контейнер <body> . . . </body>. Хотя в этом контейнере можно установить множество различных свойств документа, всеже имеются так ие свойства, значения которых нельзя установить с помощбю этих тегов. Синтаксис тега я не буду приводить, - его можно найти в спецификации HTML. Мы же, будем считать, что синтаксис HTML знаем. Ну а если для вас им еются затруднения, можете найти полное описание языка HTML на множестве других страниц в Интернете. Пер ейдем же к свойствам и методам объекта document.
Для обращения к свойствам и методам объекта document применяется следующий синтаксис:

document.propertyName
document.methodName ( parameters)

Свойства

Объект document имеет достаточно много свойств, каждое из ко торых соответствует определенному HTML-тегу в текущем документе:
    • alinkColor- соответ ствует атрибуту alink тега <body>;
    • anchors- массив, который соответствует всем меткам в документе;
    • bgColor- соответствует атрибуту bgColor (цвет фона) тега <body>;
    • cookie- представляет собой фрагмент информации, записанный на локальный диск ("к лючик");
    • fgColor- соответствует атрибуту fgColor (цвет текста) тега <body>;
    • forms- массив, содержащий все теги <form> в текущем документе;
    • images- масив изображений, ссылки на которые заданы в текущем документе;
    • lastModified- дата послед него изменения текущего документа;
    • linkColor- соответствует атрибуту linkColor (цвет гипер связи по умолчанию);
    • links- масив, содержащий все гипервязи в текущем документе ;
    • location- соответствует адресу URL текущего документа;
    • referrer- соответсствует адреу URL документа, из которого пользователь перешел к текущему документу;
    • title- соответствует соде ржимому контейнера <title> . . . </title>;
    • vlinkColor- соответствует атрибуту vlinkColor (цвет <FONT COLOR="#800080">посещенной связи) тега <body>.


Методы

Метод clear() предназначен для очистки текущего документа. Лучше использовать для очист ки методы open() и close(). Для записи информации в браузер применяют методы write() и writeln(). Покольку эти методы записывают текст в браузер в HTML-формате, вы можете создавать л юбой HTML-документ динамически, включая готовые приложения на языке JavaScript. Если в окно загружен док умент, то запись данных поверх него может привести к сбою. Поэтому в окно следует записывать поток данных, для чего с помощью метода document.open() нужно открыть документ, а затем, вызвав необходимое ко личество раз метод document.wtite(), записать данные в документ. В заключение, чтобы послать данные в браузер, следует вызвать метод document.close().

Обработчики событий

В те гах <body> и <frame> можно использовать обработчики событий, связанных загрузкой и выгрузкой документа, onLoad и onUnload. Примеры использования событий будем разбир ать позже.

Приведем несколько примеров использования объекта document.

Для записи текста в HTML-формате в браузер иногда применяют функцию document.writeln(). Например, можно динамически создавать теги изображений, выводя изображения на экран посредством следующего:

document.open ();
document.writeln("<img sr='myimage.gif'>");
document.close();

С помощью JavaScript пр ограмм, а в частности при помощи объекта document, можно создавать законченные HTML-документы и другие JavaScript программы. Например:

document.open();
document.writeln("<script language= 'JavaSript'>"+
"alert('Hello World!')"+
"</script>");
document.close();
Красиво, не правда ли!
Заметьте, что в приведенных примерах неколько строк объединяются при помощи операции сложен ия +. Этот способ удобно применять, когда строки текста программы слишком длинны, чтобы поместиться в ре дактируемом окне, или когда сложные строки необходимо разбить на несколько простых.

Объект location

Данный объект сохраняет местоположение текущего документа в виде адреса URL этого д окумента. При управлении объектом location существует возможность изменять адрес URL документа. Объект location связан с текущим объектом window - окном, в которое загружен документ. Документы не содержат информации об адресах URL. Эти адреса являются свойством объектов window.
Синтаксис:

[windowVar.]location.prepertyName

где windowVar - необязательная пер еменная, задающая конкретное окно, к которому хотите обратиться. Эта переменная также позволяет обращат ься к фрейму во фреймосодержащем документе при помощи свойства parent - синонима, использ уемого при обращении к объекту window верхнего уровня, если окон несколько. Объект location является свойством объекта window. Если вы обращаетесь к объекту location без указания имени окна, то подразумевается свойство текущего окна.
Свойство location объек та window легко перепутать со свойством location объекта document. Зна чение свойства document.location изменить нельзя, а значение свойства location окна - м ожно, например при помощи выражения window.location.property. Значение document.location< /B> присваивается объекту window.location при первоначальной загрузке документа, потому, что докум енты всегда загружаются в окна.


Свойства

Объект location имеет следующие сво йства:
    • hash - имя метки в адресе URL (если задано);
    • host - часть hostname:port адреса URL текущего документа;
    • hostname - имя хоста и домена (или цифровой IP-ад рес) в адресе URL текущего документа;
    • href - полный адрес URL текущего документа;
    • pathname - часть адреса URL, описывающая каталог, в котором находится документ;
    • port - номер порта, который использует сервер;
    • protocol - префикс адреса URL, описывающий проток ол обмена, (например, http:);
    • target - соответствует атрибуту target в теге <href>.


    Методы и обработчики событий

    Для объекта location методы, не определены, так же не связан с какими-либо обработчиками событий.

    Примеры

    Чтобы присвоить свойству location текущего окна в качестве значения новый адрес URL, используйте такой вид:
    self.location="http:// wdstudio.al.ru";
    который в данном случае загружает в текущее окно Web-страницу. Вы можете опустить объ ект self, поскольку он является ссылкой на текущее окно.
    Чтобы загрузить ресурс в фреймо содержащий документ, можно записать так:
    parent.frames[0].location = "http://my.site.ru";
    где parent.frames[0] соответствует первому фрейму в текущем документе.

    Объект history< /b>

    Объект history содержит список адресов URL, посещенных в этом сеансе. Объект history связан с текущим документом. Несколько методов этого объекта позволяют загружать в браузер различные ресурсы и обеспечивают навигацию по посещенным ресурсам.

    Синтаксис:

    history.propertyName
    history.methodName (parameters)

    Свойства

    Значением свойства length является количество элементов в списке объекта history.

    Методы

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

    Обработчики событий для объектов history не определены.

    Приведем примеры использования объекта history:
    Чтобы посмотреть пред ыдущий загруженный документ, воспользуйтесь оператором:

    history.go(-1);
    или
    history.back() ;

    Для обращения к истории конкретного окна или фрейма применяют объект parent:

    parent.frames[0].history.forward();

    загружает в первый фрейм предыдущий документ. А если открыто несколько окон браузера можно использовать вид:

    window1.frames[0].history.forward() ;

    здесь в первый фрейм окна window1 будет загружен следующий документ из списка о бъекта history.

    Объект navigator

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

    navigator.propertyName

    Методы и события, как и не трудно догадаться не определены для этого объекта. Да и свойства только для чтения, так как ресурс с информацией о версии не доступен для редактирования.

    Свойства

      • appCodeName - кодовое имя браузе ра;
      • appName - название браузера;
      • appVersion - информация о версии браузера;
      • userAgent - кодовое имя и версия браузера;
      • plugins - массив подключаемых модулей (п охоже только для Netscape);
      • mimeTypes - поддерживаемый массив типов MIME.




    На этом на сегодня все.
    До встречи в следующих выпусках.

    Владимир Максимишин


    Уважаемые читатели. Теперь Вы сможете изучить JAVASCRIPT самостоятельно, украсить свой сайт интересным скриптом, скачав пакет "Все о JAVASCRIPT". Скачать его Вы сможете отсюда -
    СКАЧАТЬ ПАКЕТ "ВСЕ О JAVASCRIPT"    


    Внимание: пакет находится под паролем.
    Просмотреть наименование его содержимого Вы сможете, а откроете только после опла ты и получения от нас паролей к материалам.

    Содержание пакета:

    1) Полнофункциональный сборник "1000 яваскриптов" - стоимость 250 рублей, или 10$ .
    2) Бонусы ( бесплатно):
        а) Руководство по Яваскрипт
        б) Учебник по Яваскрипт
        в) Яваскрипт в примерах

     Наши реквизиты для оплаты вложены в пакет в текстовый файл "Прочитать", либо Вы сможете их просмотреть здесь:http://javascript05.narod.ru/1111.html


Subscribe.Ru
Поддержка подписчиков
Другие рассылки этой тематики
Другие рассылки этого автора		 Подписан адрес:
Код этой рассылки: inet.webbuild.javascript05
Архив рассылки		 Отписаться Вебом Почтой
Вспомнить пароль
В избранное