Клиентские сценарии в Web сети (стр. 3 )

Метод	Описание	Синтаксис	Эквивалент HTML
anchor	Создает HTML-элемент anchor.	str. anchor(имя)	<A>имя</A>
big	Строка большими буквами	str. big()	<BIG>строка</BIG>
bold	Строка полужирным шрифтом	str. bold()	<B>строка</B>
fixed	Строка шрифтом фиксированной ширины	str. fixed()	<TT>строка</TT>
fontcolor	Устанавливает цвет шрифта в строке	str. fontcolor (цвет)	<FONT COLOR=цвет>
fontsize	Устанавливает размер шрифта в строке	str. fontsize(n)	<FONT SIZE=n>
italics	Строка курсивом	str. italics()	<I>строка</I>
link	Добавляет к строке гиперссылку	str. link(URL)	<A HREF=URL>строка</A>
small	Строка маленькими буквами	str. small()	<SMALL>строка </SMALL>
sub	Нижний индекс	str. sub()	<SUB>строка</SUB>
sup	Верхний индекс	str. sup()	<SUP>строка</SUP>

2.2.5.Стандартные функции верхнего уровня

В добавление к стандартным объектам существует несколько функций, для вызова которых не надо создавать никакого объекта. Они находятся вне иерархии объектов JavaScript на так называемом «верхнем уровне».

Полезными при разработке приложений могут оказаться две функции, производящие «синтаксический» анализ своих аргументов: parseFloat и parseInt.

Функция анализирует parseFloat(параметр) значение переданного ей строкового параметра на соответствие представлению вещественного числа в JavaScript. Если в стоке при последовательном просмотре обнаруживается символ, отличный от символов, применяемых для формирования вещественных литералов (знаки + и -, десятичные цифры, точка и символы e или E), то она игнорирует оставшуюся часть строки и возвращает то числовое значение, которое ею обнаружено, до неправильного символа. Если первый символ в строке не является цифрой, она возвращает значение “NaN” (Not a Number – не число).

Аналогично функция parseInt(строка, [основание]) пытается возвратить целое число по заданному вторым параметром основанию. Если первый символ в строке не является цифрой, она также возвращает значение “NaN”.

Функция eval(строка) выполняет переданную ей строку так, как если бы это было обычное выражение JavaScript или набор выражений.

Функция escape(строка_символов) применяет HTML-кодировку к указанной строке.

Функция unescape(строка_кода)выполняет обратные действия, возвращая декодированную строку.

2.3. Объекты клиента и обработка событий

Как отмечалось выше, при интерпретации страницы HTML создаются объекты JavaScript, свойства которых представляют значения параметров тэгов языка HTML. Объекты хранятся в виде иерархической структуры, отражая структуру документа. Некоторые тэги являются контейнерами, в которых могут размещаться другие тэги. Например, тэг формы <FORM> содержит элементы управления, задаваемые тэгами <INPUT>. Эта подчиненность одних тэгов другим и образует структуру документа, отражаясь в иерархической структуре объектов соответствующих тэгам HTML.

2.3.1. Иерархия объектов

На самом верхнем уровне иерархии находится объект window, представляющий окно браузера и являющийся «родителем» всех остальных объектов. Расположенные ниже в иерархии объекты могут иметь свои подчиненные объекты. На рис. показана упрощенная структура объектов клиента (браузера).

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

Каждая страница в добавление к объекту navigator обязательно имеет еще четыре объекта:

·  window – объект верхнего уровня, свойства которого применяются ко всему окну, в котором отображается документ;

·  document – свойства которого определяются содержимым самого документа: связи, цвет фона, формы и т. д.;

·  location – свойства которого связаны с URL-адресом отображаемого документа;

·  history – представляет адреса ранее загружавшихся HTML-страниц.

Кроме указанных объектов страница может иметь дополнительные объекты, зависящие от ее содержимого, которые являются дочерними объектами объекта document. Если на странице расположена форма, то все ее элементы являются дочерними объектами этой формы. Для задания точного имени объекта используется точечная нотация с полным указанием всей цепочки наследования объекта. Это возможно, так как объект верхнего уровня имеет свойство, значением которого является объект нижнего уровня. Ссылка на объект осуществляется по имени, заданному параметром NAME тэга HTML. Например:

<FORM NAME=”forma1”>

Фамилия: <INPUT TYPE=”text” NAME=”secondName”>

Имя: <INPUT TYPE=”text” NAME=”firstName”>

Группа: <INPUT TYPE=”text” NAME=”groupN”>

</FORM>

Для получения фамилии студента в программе JavaScript следует использовать ссылку document. forma1.secondName. value, а для получения номера группы - document. forma1.groupN. value.

При ссылке на формы и их элементы необязательно указывать объект верхнего уровня document. Например, forma1.groupN. value.

2.3.2. Свойства и методы ключевых объектов. Объекты window и frame

Не все объекты иерархии интенсивно используются в сценариях JavaScript. Рассмотрим свойства и методы наиболее часто используемых объектов.

Объект window создается автоматически при запуске браузера, так как для отображения документа необходимо окно. В меню Файл (File) любого браузера есть команда Создать (New), позволяющая открыть новое окно и отобразить в нем документ, и команда Закрыть (Close) закрытия окна. Эти действия можно осуществлять программно из приложения JavaScript, применяя методы open() и close() объекта window:

имя_окна = window. open([имя_файла], [ссылка], [параметры])

где имя_окна – имя для ссылки на новое окно в операторах JavaScript;

имя_файла - полный или относительный URL-адрес открываемого в окне документа;

ссылка - имя, указываемое в качестве цели в гипертекстовой ссылке на это окно из другого документа HTML;

параметры – задают значения параметров окна (ширина, высота, наличие панелей инструментов, полос прокрутки и т. п.).

Параметр	Значения	Описание
fullscreen	yes|no|1|0	Указывает, показывается ли новое окно на полный экран или как обычное окно
channelmode	yes|no|1|0	Отображается ли полоса каналов
toolbar	yes|no|1|0	Отображается ли полоса кнопок
location	yes|no|1|0	Отображается ли полоса ввода адреса
directories	yes|no|1|0	Отображается полоса для выбора каталога
status	yes|no|1|0	Полоса статуса
menubar	yes|no|1|0	Полоса меню
scrollbar	yes|no|1|0	Задает отображение горизонтальной и вертикальной полос прокрутки
resizable	yes|no|1|0	Могут ли окна изменять свой размер
width	Число	Ширина окна в пикселах (минимум 100)
height	Число	Высота окна в пикселах (минимум 100)
top	Число	Вертикальная координата левого верхнего угла окна
left	Число	Горизонтальная координата левого верхнего угла окна

Например:

winName=window. open('','newWin','fullscreen=0,status=0, menubar=yes, toolbar=1,directories=1,scrollbars=1,resizable=0,width=400,height=200')

Закрывается окно методом close() без параметров, например:

window. close(); self. close(); close()

Для закрытия окна, открытого методом open(), необходимо явно указывать имя переменной этого окна, например:

winName. close()

Свойства объекта window:

Свойство	Описание
parent	Возвращает родительское окно для данного окна
self	Возвращает ссылку на текущее окно
top	Возвращает ссылку на самое ближнее к пользователю окно
name	Возвращает имя окна, заданное тэгом <FRAMESET>
opener	Возвращает окно, создавшее данное окно
closed	Указывает на то, что окно закрыто
status	Задает текст, отображаемый в статусной панели
clientInformation	Возвращает ссылку на объект navigator
document	Возвращает ссылку на объект document
event	Возвращает ссылку на глобальный объект event
history	Возвращает ссылку на объект history
location	Возвращает ссылку на объект location
navigator	Возвращает ссылку на объект navigator
screen	Возвращает ссылку на глобальный объект screen

Методы объекта window:

Метод	Описание
open	Открывает новое окно браузера
close	Закрывает текущее окно браузера
alert	Отображает панель сообщений Alert
prompt	Отображает диалоговую панель Prompt
confirm	Отображает диалоговую панель Confirm
navigate	Загружает другую страницу
blur	Вызывает потерю страницей фокуса
focus	Переводит фокус на данную страницу
setInterval	Задает интервал выполнения указанной функции
setTimeout	Задает временную задержку перед выполнением указанной функции
clearInterval	Отменяет интервал, заданный функцией setInterval
clearTimeout	Отменяет задержку, заданную функцией setTimeout

Два метода объекта window – setTimeout и setInterval – используются для управлением таймером. Метод setTimeout создает таймер, который выполняет указанные действия по истечении заданного числа миллисекунд.

Например:

function showtimeOut()

{ document. write(“Время вышло…”) }

function timerDemo()

//вызвать showtimeOut() через 5 секунд

{ window. setTimeout(“showtimeOut()”, 5000) }

timerDemo()

или

{ window. setInterval(“showtimeOut()”, 5000) }

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