- •Часть I. Язык сценариев JavaScript 3
- •Часть II. Среда клиента 73
- •Часть III. Динамический html 95
- •Клиентское Web-программирование
- •Часть I. Язык сценариев JavaScript Урок 1. Модель клиент-сервер в Интернете Распределенные системы и приложения
- •Http-запрос
- •Http-ответ
- •Урок 2. Сценарии JavaScript в документах html Языки сценариев
- •Язык JavaScript
- •Основные положения синтаксиса
- •Размещение операторов языка на странице
- •Упражнения
- •Урок 3. Переменные и литералы
- •Числовой тип
- •Строковый тип
- •Булевый тип
- •Специальные типы данных
- •Переменные
- •Определение типа переменной
- •Упражнения
- •Урок 4. Выражения и операции
- •Арифметические операции
- •Логические выражения
- •Строковые операции
- •Комбинированные операции присваивания
- •Условная операция
- •Приоритет операций
- •Упражнения
- •Урок 5. Операторы
- •Операторы выбора
- •Операторы цикла
- •Упражнения
- •Урок 6. Функции
- •Упражнения
- •Урок 7. Встроенные объекты (1)
- •Объект Array
- •Объект Date
- •Объект Math
- •Объект String
- •Объект Function
- •Объект Boolean
- •Объект Number
- •Упражнения
- •Урок 8 Встроенные объекты (2) Объект Object
- •Стандартные функции верхнего уровня (объект Global)
- •Манипулирование объектами
- •Обработка ошибок
- •Упражнения
- •Урок 9. Создание собственных объектов
- •Упражнения
- •Часть II. Среда клиента Урок 10. Объектная модель ms Internet Explorer
- •Объект window
- •Объект navigator
- •Объект location
- •Объект history
- •Упражнения
- •Урок 11. Объекты доступа к странице и ее элементам Объект document
- •Объект body
- •Объект form
- •Упражнения
- •Урок 12. Обработка событий в ms Internet Explorer Обработчики событий
- •Вызов процедуры обработки события
- •Событийная модель
- •Объект event (ie)
- •Упражнения
- •Часть III. Динамический html Урок 13. Объектная модель документа dhtml
- •Структура документа
- •Иерархия объектов
- •Свойства и методы объектов
- •Упражнения
- •Урок 14. Примеры динамических страниц html Раскрывающийся список
- •Движущийся элемент
- •Динамическое изменение таблиц
- •Родственные отношения
- •Упражнения
- •Урок 15. Объектная модель документа dom
- •Узлы объектной модели dom
- •Перемещение по объектной модели
- •Изменение объектной модели документа
- •Упражнения
Манипулирование объектами
Для работы с объектами в JavaScript предназначены два оператора. С одним из них мы познакомились в примере 10 — цикл по свойствам объекта:
for( переменная_цикла in объект) {
[операторы]
}
Этот цикл осуществляет перебор всех свойств объекта. В переменной цикла на каждой итерации сохраняется название свойства объекта. Значение свойства объекта можно получить с помощью конструкции
объект[имя_свойства]
Количество итераций равно количеству перечисляемых свойств, существующих у заданного в заголовке цикла объекта.
Пример 11. Перечисление свойства объекта HTML
Для обеспечения возможности доступа в сценарии к элементу HTML отображаемого в браузере документа с помощью объекта в язык HTML была добавлена возможность идентификации любого элемента страницы с помощью атрибута id. Его значением является алфавитно-цифровой идентификатор, начинающийся с буквы. По этому имени в сценарии JavaScript можно получить ссылку на объект, соответствующий указанному элементу HTML. В Internet Explorer для этого достаточно указать это имя и автоматически ссылка будет получена. После чего можно получать или изменять значения свойств этого объекта, обычно соответствующих атрибутам элемента HTML, соответствующего этому объекту. Однако у всех объектов есть свойства, которые не соответствуют никаким атрибутам. Эти свойства реализованы в соответствии с используемой в браузере объектной моделью документа.
В представленном ниже сценарии при щелчке на кнопке Свойства абзаца вызывается функция properties(), в которую передается ссылка на объект par1, соответствующий абзацу страницы HTML. Эта функция возвращает строку с названиями и значениями всех свойств объекта, соответствующего абзацу с атрибутом id=par1, которая отображается на странице HTML.
<HEAD>
<SCRIPT LANGUAGE="JaVaSCRipt">
<!--
function properties(obj) {
var result = ""
for (var i in obj) {
result += obj.id + "." +
i + " = " + obj[i] + "<BR>"
}
result += "<HR>"
return result
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<p id="par1">
Получить в сценарии доступ к объекту, соответствующему
какому-нибудь элементу HTML страницы, можно с помощью
значений его атрибутов <b>id</b> или <b>name</b>.
</p>
<input type=button value="Свойства абзаца"
onclick="document.write(properties(par1))">
</BODY>
Второй оператор, предназначенный для работы с объектами, — оператор with, позволяющий задать объект по умолчанию для блока операторов, определенных в его теле. Это означает, что все встречаемые в операторах этого блока свойства и методы являются свойствами и методами указанного объекта. Применение этого оператора избавляет от необходимости указывать иерархию принадлежности объекта и сокращает исходный текст программы.
Текст приведенного выше сценария с использованием оператора with можно записать и так:
with( obj) {
result += id + "." +
i + " = " + [i] + "<BR>"
}
Полезно использовать этот оператор для объекта Math. Тогда обращение к его свойствам и методам осуществляется без явного указания префикса Math. Например:
with(Math) {
r = sin(2.0) // Вычисление синуса
l = 2*PI*r // Вычисление длины окружности
}