3.3. Вопросы кириллизации

Кириллизация Internet/Intranet-приложений затрагивает общение пользователей с различными ресурсами Web, E-mail, FTP и др. Поэтому вопросы кириллизации должны решаться интегрированно при настройке сервисов.

Настройка Internet-сервисов выполняется путем выбора таблицы кодировки и установки соответствующих фонтов шрифтов. Часто решение проблемы кириллизации сводится к хранению текстов в нескольких кодировках, однако это нехарактерно для Intranet.

3.3.1. Поддержка различных кодировок кириллицы

Исторически сложилось так, что каждое семейство операционных систем имеет свою кодировку для русских букв. Применяются кодировки koi8-r, описанная в документе RFC-1489, Windowscp1251, MS-DOSx-cp866, а также кодировка ISO-8859-x.

Поэтому на титульных страницах большинства русскоязычных Web-серверов можно встретить предложение выбрать подходящую кодировку - для MS-DOS, для Windows, для Macintosh, и, наконец, для UNIX. Таким образом, сотрудники информационной службы Web-сервера должны готовить тождественные материалы в 4 кодировках, загромождая Web-сервер.

MicrosoftInternetExplorer работает в кодировке Windows, а NetscapeNavigator понимает koi8‑r, Windowscp1251, ISO-8859-5. (Нужно выбрать в меню режим Options функцию DocumentEncoding и нужную кодировку, повторно загрузить страницу.) При использовании серверных API перекодировка может выполняться на лету, но этот путь мало изведан.

Неоднократно появлялись предложения разделить кодировки на сетевую и локальную. В качестве сетевой в Internet было бы естественно выбрать koi8-r, наиболее распространенную кодировку в различных версиях операционных систем типа UNIX, а для Intranet - кодировку Windowscp1251. Переход к локальной кодировке и обратно к сетевой должен выполняться клиентским приложением. К сожалению, разработчики броузеров пока не прислушиваются к этим предложениям, возможно, из-за того, что сами не сталкиваются с неудобствами использования четырех кодировок для одного языка.

С помощью API для Web-серверов возможно создать серверные программы перекодировки "на лету".

3.3.2. Кириллизация при подготовке и конвертировании гипертекста

При подготовке документов используется кодировка, основная для редактора, а размножение текстов в разных кодировках выполняется с помощью специальных программ перекодировки. Можно воспользоваться способностью редактора загружать и сохранять текст в различных форматах, например, для Windows и MS-DOS. Также возможно применить драйвер Generic/Textonly в Windows95 для "печати файла" в файл, предварительно настроив таблицу перекодировки.

При конвертировании русскоязычных документов с помощью WordAssistant возникают проблемы с преобразованием фонтов SmallCaps и AllCaps. Все русские буквы конвертируются в названия спецсимволов, начинающиеся с &. Иногда для прочтения таких текстов требуется выполнить программу перекодировки из спецсимволов в нужный код. В приведенном примере можно просто заменить все неподходящие фонты на другие перед конвертированием.

3.4. Языки разработки интерактивных страниц гипертекста и гипермедиа

Для оживления статического гипертекста и придания страницам интерактивных свойств применяются языки сценариев, такие как JavaScript, VBScript. Тексты сценариев встраиваются непосредственно в страницы гипертекста и интерпретируются броузером.

Особую нишу занимает объектно-ориентированный язык Java для написания мобильных Internet/Intranet-приложений. Страница содержит только ссылки на Java-модули, они независимо загружаются и выполняются броузером на клиентской стороне.

3.4.1. Язык сценариев JavaScript

Язык программирования сценариев JavaScript, разработанный фирмой Netscape совместно с Sun,- это компактный, объектно-ориентированный язык, предназначенный для создания небольших клиентских и серверных Internet/Intranet-приложений. В целом язык ориентирован на встроенные объекты NetscapeNavigator: окна, формы, поля форм, элементы рабочих областей Navigator. Это сильно облегчает обучение языку и позволяет сразу писать интересные и полезные программы.

Сценарии, написанные на языке JavaScript, включаются в состав HTML-документов, размещаются на Web-сервере и вместе с ними передаются клиентам по запросам. Броузеры распознают встроенные в текст документа программы и выполняют их путем интерпретации. Используя JavaScript, можно организовать многооконный интерфейс с локальной справочной системой и встроенной графикой, возложив при этом многие вопросы проверки вводимых пользователем данных на JavaScript. По своим функциональным возможностям JavaScript довольно сильно уступает Java: можно организовать прокрутку текста, организовать открытие нового окна, запрограммировать калькулятор, но не более того.

Примерами программ на JavaScript могут служить сценарии, проверяющие введенные пользователем данные, выполняющие какие-либо действия по открытию и закрытию документа. Такие сценарии могут быть обработчиками диалоговых событий - распознавать и реагировать на действия пользователя - нажатие кнопок мыши, ввод данных в форме и перемещение по странице. Помимо этого с помощью сценария можно управлять самим броузером и атрибутами документа.

Сравнение языков программирования JavaScript и Java

Язык JavaScript построен на основе Java, но не обладает строгой типизацией. Он поддерживает многие синтаксические конструкции Java, но не имеет понятия классов, существует лишь небольшой набор типов данных: числовые, строковые и булевские. В JavaScript имеются функции, которые могут быть как методами объектов, так и самостоятельными. Основные отличия языков JavaScript и Java сведены в таблице 3.1.

Таблица 3.1. Сравнение языков JavaScript и Java

Язык JavaScript	Язык Java
Программа интерпретируется (не компилируется) клиентским приложением	Программа компилируется на сервере перед выполнением на клиенте
Объектный-ориентированный язык. Используются встроенные объекты с возможностью расширения, но без классов и наследования	Объектно-ориентированный язык. Клиентские Java-прикложения (апплеты) строятся на классах с наследованием
Сценарий содержится в гипертекстовом документе	Апплеты загружаются с сервера
Переменные сценария не описываются (свободная типизация)	Переменные апплета должны быть описаны (строгая типизация)
Динамическое связывание. Проверка ссылок на объекты производится на этапе выполнения сценария	Статическое связывание. Ссылки на объекты должны существовать во время компиляции

Создание и исполнение сценариев на JavaScript требует лишь наличия редактора, позволяющего создавать гипертекст на языке HTML, и броузера, понимающего JavaScript.

Включение сценариев в гипертекст

Для оформления сценария JavaScript в теле документа используются специальные теги языка HTML. Сценарий встраивается в документ с помощью тега <SCRIPT>. Сценарий может содержать произвольное количество операторов языка JavaScript внутри тегов <SCRIPT> </SCRIPT>. Часто текст сценария помещают в комментарии, чтобы исключить его отображение на старых броузерах, не поддерживающих JavaScript. Пример оформления простого сценария:

<HTML>
<BODY>
<SCRIPTLANGUAGE="JavaScript">
<!- Пример простого сценария
 document.write("HellofromJavaSript")
// ->
</SCRIPT>
</BODY>
</HTML>

С помощью метода document.writeln можно выводить текст с использованием тегов форматирования <I>, <B>, <U>, <Hn> и др. Это позволяет динамически формировать гипертекст.

Используя эти возможности, легко вывести на экран графическое изображение из указанного файла:

<SCRIPT>
 document.writeln("<IMGSRC=\"logo.gif\">");
</SCRIPT>

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

В основном JavaScript применяется для создания интерактивных документов. Диалоговый элемент INPUT формы расширен и может содержать указание на событие и функцию его обработки.

Основной синтаксис, используемый для указания обработчиков событий:

<TAGeventHandler="JavaScriptCode">

Здесь TAG - это некоторый тег HTML, а eventHandler - имя обработчика событий. Как правило, обработчик событий имеет имя, совпадающее с именем события, с приставкой "on" (см. таблицу 3.2). Заметим, что многие объекты имеют методы, эмулирующие события, но эти методы не запускают обработчик события.

Таблица 3.2. Типы событий и обработчиков

Событие	Когда происходит	Обработчик события
blur	Потеря фокуса ввода элементом формы	onBlur
click	Пользователь щелкает мышкой по элементу формы или связи	onClick
change	Пользователь изменяет значение элемента text, textarea, или выделяет элемент	onChange
focus	Установка фокуса ввода на элементе формы	onFocus
load	Пользователь загружает страницу в броузер	onLoad
mouseover	Пользователь двигает мышью над связью или якорем	onMouseOver
select	Пользователь выбирает поле ввода элемента формы	onSelect
submit	Пользователь посылает форму	onSubmit
unload	Пользователь выходит со страницы	onUnload

Ниже представлен пример диалога ввода имени пользователя и вывода сообщения приветствия. Нажатие кнопки мыши вне элемента ввода (событие onBlur - потеря фокуса) после набора строки текста приводит к вызову стандартной функции alert для выдачи сообщения.

<SCRIPT>
 functionsalut (name)
 {
 alert ("Здравствуйте, ", name, " !");
 }
</SCRIPT>
<BODY>
Введите Ваше имя:
<FORM>
 <INPUTtype="text" name="user"
 onBlur="salut(this.value)" value="">
</FORM>
</BODY>

Другой пример иллюстрирует обработку события onClick при нажатии видео-кнопки документа - вызов функции подтверждения confirm:

<FORM>
 <INPUTtype="button" name="btn1" value="Выход"
 onClick="confirm('Вы желаете покинуть страницу')">
</FORM>

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

Свойства объекта document

Основным объектом JavaScript является HTML-документ. Кроме методов для вывода текста на экран, этот объект содержит набор свойств, описывающих документ (см. таблицу 3.3).

Таблица 3.3. Свойства объекта document

Свойство объекта	Описание
title	Заголовок документа, соответствует содержимому тега <TITLE>
location	Полный адрес (URL) документа
lastModified	Дата последней модификации
referrer	Адрес (URL) ссылающегося документа
anchors, links	Массивы ссылок в документе
forms	Содержит все диалоговые формы документа
cookie	Отметки состояний
fgColor	Цвет текста (атрибут TEXT тега <BODY>)
bgColor	Цвет фона (атрибут BGCOLOR тега <BODY>)
alinkColor	Соответствует атрибуту ALINK тега <BODY>
linkColor	Соответствует атрибуту LINK тега <BODY>
vlinkColor	Соответствует атрибуту VLINK тега <BODY>

Пример сценария, изменяющего по нажатию кнопки цвета фона документа на темно-синий, а цвета текста - на белый:

<SCRIPT>
 functionchColor()
 {
 document.bgcolor="#000080";
 document.fgcolor="white";
 }
</SCRIPT>
<FORM>
 <INPUTtype="button" name="btn2"  value=" Смена цвета" onClick="chColor()">
</FORM>

Язык JavaScript имеет развитые алгоритмические возможности, необходимые для написания расчетных программ. С его помощью можно написать сценарии для доступа к БД и построения диаграмм и графиков.

Массивы

Первый тип новых объектов, которые появились в JavaScript 1.1,- массивы. Тип "Array" введен в JavaScript 1.1 для возможности манипулирования самыми разными объектами, которые отображаются Navigator-ом. Это - список всех гипертекстовых ссылок данной страницы Website, список всех картинок на данной странице, список всех апплетов данной страницы, список всех элементов формы и т.п. Пользователь может создать и свой собственный массив, используя конструктор Array (). Делается это следующим образом:

new_array = newArray ()
new_array5 = newArray (5)
colors = newArray ("red","white","blue")

Размерность массива может динамически изменяться. Можно сначала определить массив, а потом присвоить одному из его элементов значение. Как только это значение будет присвоено, изменится и размерность массива:

colors = newArray ()
colors[5] = "red"

В данном случае массив будет состоять из 6 элементов, т.к. первым элементом массива считается элемент с индексом 0.

Для массивов определены три метода: join, reverse, sort. Join объединяет элементы массива в строку символов, в качестве аргумента в этом методе задается разделитель:

colors = newArray ("red","white","blue")
string = acolors.join (" + ")

В результате присваивания значения строке символов string мы получим следующую строку:

string = "red + white + blue"

Другой метод, reverse, изменяет порядок элементов массива на обратный, а метод sort отсортировывает их в порядке возрастания.

У массивов есть два свойства: length и prototype. Length определяет число элементов массива. Если нужно выполнить некоторую рутинную операцию над всеми элементами массива, то можно воспользоваться циклом типа:

color = newArray ("red","white","blue")
n = 0
while (n != colors.length)
{.... операторы тела цикла ...}

Свойство prototype позволяет добавить свойства к объектам массива. Однако наиболее часто в программах на JavaScript используются встроенные массивы, главным образом графические образы (Images) и гипертекстовые ссылки (Links).

Графика

До Navigator 3.0 в JavaScript использовались только встроенные объекты типа Image. В новой версии языка появился конструктор для этого типа объектов:

new_image = newImage ()
new_image = newImage (width,height)

Часто для реализации мультипликации создают массив графических объектов, которые потом прокручивают один за другим:

img_array = newArray ()
img_array[0] = newImage (50,100)
img_array[1] = newImage (50,100)
....
img_array[99] = newImage (50,100)

У объекта Image существует 10 свойств, из которых самым важным является src. Для присваивания конкретных картинок элементам массива img_array следует воспользоваться следующей последовательностью команд:

img_array[0].src = "image1.gif" border=0
img_array[1].src = "image2.gif" border=0
...
img_array[99].src = "image100.gif" border=0

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

В новой версии языка объект типа Image можно поименовать в HTML-теге IMG. После этого можно обращаться к нему по имени. При этом следует учитывать, что если Image используется внутри формы, то он является свойством этой формы. Это значит, что для следующего графического объекта должны быть использованы разные составные имена:

<imgname=carsrc=car.gif> <--- Встроенный в документ объект
document.car.src = "car1.gif" border=0
 
<formname=kuku>
<imgname=carsrc=car.gif> <-- Встроенный в форму документ.
</form>
document.kuku.car.src = "car1.gif" border=0

Однако, наиболее часто в примерах использования скриптов можно встретить обращение к Image по индексу в массиве всех графических объектов данной страницы. Если наш объект, например, является вторым графическим объектом Image на странице, то будь он внутри формы или за ее пределами к нему всегда можно обратиться по индексу:

document.images[1].src = "car1.gif" border=0

Расширяя наш пример с массивом Image, создадим документ, в который будет встроена мультипликация, определенная нашим массивом:

<HTML>
<HEAD>
<SCRIPT>
functionmulti_pulti ()
 {
 img_array = newArray ()
 img_array[0] = newImage (50,100)
 ....
 img_array[99] = newImage (50,100)
 img_array[0].src = "image1.gif" border=0
 ...
 img_array[99].src = "image100.gif" border=0
 n=0
 while (n==0)
 {
 document.images[0].src = img_array[0].src
 ...
 document.images[99].src = img_array[99].src
 n++;
 }
 }
</SCRIPT>
</head>
<bodyonLoad="multi_pulti ()">
<imgsrc=image1.gif>
</body>
</html>

Довольно часто используют не мультипликацию, а выбор картинки через OPTION, еще один новый объект JavaScript. При этом можно через поле формы SELECT менять не только саму картинку, но и гипертекстовую ссылку, которая может быть связана с этой картинкой. На гипертекстовую ссылку также можно ссылаться по индексу:

document.links[index].href = kuku.html

Данный прием оправдан и с точки зрения интерфейса навигатора. При использовании такого сорта массивов ссылок не требуется их длительное перечисление и листание страницы в рабочей области навигатора - можно просто выбрать ссылку из "выпадающего" меню.

Другой способ для сокращения числа нажатий на клавиши - использование событий. В том же объекте OPTION можно использовать событие onChange, что делает необязательным нажатие кнопок типа submit. В этом случае достаточно будет просто выбрать альтернативу и перейти к новой странице сразу после выбора.

Стеки гипертекстовых ссылок

В язык теперь введен новый тип объектов Area. Area - это элемент контейнера MAP, который определяет client-siteimagemap. Собственно, главное достоинство такого объекта состоит в том, что гипертекстовые ссылки, которые определены в AREA стали доступны для переопределения. Они появляются в массиве обычных ссылок страницы и можно как получить значение URL, так и переопределить его. К объекту AREA нельзя обратиться по имени. Можно использовать только индекс массива гипертекстовых ссылок документа.

В контексте стека гипертекстовых ссылок интересно рассмотреть еще одну возможность JavaScript, связанную с переходом по гипертекстовой ссылке вообще. В обычном случае параметр HREF контейнера A должен иметь какое-нибудь значение. Если, например, по событию onClick необходимо открыть новое окно и в старом сохранить отображенный документ, то его URL следует указывать в качестве значения HREF. В противном случае, в старое окно будет загружена пустая страница, если HREF=" ".

В новой версии JavaScript введена функция void. Точнее, тип void, который означает отсутствие какого либо значения. Если необходимо выполнить некоторые действия при выборе гипертекстовой ссылки, но при этом не перегружать текущие страницы, то в параметре HREF можно указать конструкцию:

<AHREF="javascript:void (0)">kuku</A>

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

Фреймы и окна

При работе с фреймами и окнами в предыдущих версиях JavaScript постоянно приходилось отслеживать последовательность открытия окон и фреймов для того, чтобы аккуратно их потом закрывать. На некоторых неточностях работы с окнами были основаны так называемые mail-bombs. Суть этих "подарков" заключалась в том, что если пользователь по почте принимает документ, который состоит только из одной команды:

window.close (),

то система, не спрашивая пользователя, закрывала текущее окно, а в этот момент таким окном является окно электронной почты. Теперь, перед тем как что-либо закрыть, система будет спрашивать разрешения. Правда, если в момент получения команды на закрытие окна на экране только одно окно Navigator, то система его закроет без каких-либо комментариев.

Работа с окнами и фреймами на этом не исчерпывается. В систему введено новое свойство opener, которое определено для текущего окна или фрейма, и методы blur и focus распространены на работу с окнами.

Свойство opener определяет окно документа, который вызвал открытие окна текущего документа. Свойство определено для любого окна и фрейма. Если необходимо выполнить некоторые функции по отношению к окну, открывшему данное окно, то можно использовать выражение типа:

window.opener.[method]

Например, если требуется закрыть окно-предшественник, то можно просто выполнить метод close:

window.opener.close ()

Точно таким же способом можно изменить содержание этого окна при помощи методов write или writeln.

Можно менять и другие свойства объектов в окне-предшественнике. Следующий пример взят из дополнений к спецификации JavaScript:

window.opener.document.bgColor="СcyanТ"

В данном случае для окна-предшественника определен светло-голубой цвет в качестве цвета фона.

Но самым замечательным является то, что предшественника можно менять. Это значит, что автор получает возможность открывать и закрывать окна не в строго иерархической последовательности, а в произвольном порядке. Управление многооконным интерфейсом в этом случае становится более гибким:

window.opener = new_window
window.opener = null

Первый пример переназначает окно-предшественник, в то время как второй вообще защищает предшественника от каких-либо действий.

Все, что было сказано об окнах, распространяется и на фреймы, которые являются просто частным случаем окна.

Фрейм часто может быть порожден путем разбиения другого фрейма на части. Если при этом потребуется обратиться к окну фрейма-предшественника, то свойство opener в этом случае незаменимо.

Кроме обращения к различным свойствам окон и фреймов разработчики расширили действие методов blur и focus с фреймов до окон. Теперь не только фрейм, но и окно может быть сделано текущим с использованием метода focus или, наоборот, переведено в фон при помощи метода blur. В ряде случаев, например, при порождении нескольких страниц, обращение к этим функциям бывает довольно полезным.

Наследование кода скриптов различными страницами

У контейнера SCRIPT появился атрибут SRC. Это дает возможность авторам строить своеобразную библиотеку функций, к которым можно обращаться из любой страницы, в которой будет ссылка на такую библиотеку. При этом вовсе не обязательно размещать саму библиотеку на том же сервере, где размещены и гипертекстовые страницы Website. Можно использовать и чужие функции на JavaScript.

В атрибуте SRC используется обычный URL. Внутри файла скриптов теги SCRIPT не используются. Это обычный файл с использованием определений функций и переменных.

Другой новой возможностью работы с функциями стало введение нового объекта Function. Объект Function порождается конструктором Function:

new_Function = newFunction (arg1,arg2,...,argn, function_body)

Главное отличие от обычного декларирования функции заключается в том, что в данном случае порождена переменная new_Function, с которой можно работать, как с любым другим объектом. При обычном определении функции, такой переменной не порождается.

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

При обращении к объектам страницы-родителя можно использовать свойство opener окон и фреймов, что позволяет компенсировать отсутствие наследования и глобальных переменных в JavaScript.

Назад | Содержание | Вперед