на тему рефераты Информационно-образоательный портал
Рефераты, курсовые, дипломы, научные работы,
на тему рефераты
на тему рефераты
МЕНЮ|
на тему рефераты
поиск
JavaScript
lt;FORM NAME=f METHOD=post

ACTION="JavaScript:window.document.f.i.VALUE=

'Нажали кнопку Click';void(0);">

<TABLE BORDER=0>

<TR>

<TD><INPUT NAME=i></TD>

<TD><INPUT TYPE=submit VALUE=Click></TD>

<TD><INPUT TYPE=reset VALUE=Reset></TD>

</TABLE>

</FORM>

В URL можно размещать сложные программы и вызовы функций. Следует только помнить, что схема JavaScript работает не во всех браузерах, а только в версиях Netscape Navigator и Internet Explorer, начиная с четвертой.

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

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

Такие программы, как обработчики событий (handler), указываются в атрибутах контейнеров, с которыми эти события связаны. Например, при нажатии на кнопку происходит событие click:

<FORM><INPUT TYPE=button VALUE="Кнопка" onсlick=

"window.alert('intuit');"></FORM>

1.6 Подстановки

Подстановка (entity) встречается на Web-страницах довольно редко. Тем не менее это достаточно мощный инструмент генерации HTML-страницы на стороне браузера. Подстановки используются в качестве значений атрибутов HTML-контейнеров. Например, как значение по умолчанию поля формы, определяющего домашнюю страницу пользователя, будет указан URL текущей страницы:

<SCRIPT>

function l()

{

str = window.location.href;

return(str.length);

}

</SCRIPT>

<FORM><INPUT VALUE="&{window.location.href};" SIZE="&{l()};">

</FORM>

<SCRIPT>

<!-- Это комментарий ...JavaScript-код...// -->

</SCRIPT>

<BODY>

... Тело документа ...

</BODY>

</HTML>

HTML-комментарии здесь вставлены для защиты от интерпретации данного фрагмента страницы HTML-парсером в старых браузерах (у высокого начальства еще встречаются). В свою очередь, конец HTML-комментария защищен от интерпретации JavaScript-интерпретатором (// в начале строки). Кроме того, в качестве значения атрибута LANGUAGE у тега начала контейнера указано значение "JavaScript". VBScript, который является альтернативой JavaScript - это скорее экзотика, чем общепринятая практика, поэтому данный атрибут можно опустить - значение "JavaScript" принимается по умолчанию.

Очевидно, что размещать в заголовке документа генерацию текста страницы бессмысленно - он не будет отображен браузером. Поэтому в заголовок помещают декларации общих переменных и функций, которые будут затем использоваться в теле документа. При этом браузер Netscape Navigator более требовательный, чем Internet Explorer. Если не разместить описание функции в заголовке, то при ее вызове в теле документа можно получить сообщение о том, что данная функция не определена. Приведем пример размещения и использования функции:

<HTML>

<HEAD>

<SCRIPT>

function time_scroll()

{

var d = new Date();

window.status = d.getHours() +":"+d.getMinutes() +":"+

d.getSeconds();

setTimeout('time_scroll();',500);

}

</SCRIPT>

</HEAD>

<BODY onLoad=time_scroll()>

<CENTER>

<H1>Часы в строке статуса</H1>

В Internet Explorer 4.0 подстановки не поддерживаются, поэтому пользоваться ими следует аккуратно. Прежде чем выдать браузеру страницу с подстановками, нужно проверить тип этого браузера.

В случае подстановки интерпретатор получает управление в момент разбора браузером (компонент парсер) HTML-документа. Как только парсер встречает конструкцию &{..} у атрибута контейнера, он передает управление интерпретатору JavaScript, который, в свою очередь, после исполнения кода это управление возвращает парсеру. Таким образом данная операция аналогична подкачке графики на HTML-страницу.

1.7 Вставка (контейнер SCRIPT - принудительный вызов интерпретатора)

Контейнер SCRIPT - это развитие подстановок до возможности генерации текста документа JavaScript-кодом. В этом смысле применение SCRIPT аналогично Server Side Includes, т.е. генерации страниц документов на стороне сервера. Однако здесь мы забежали чуть вперед. При разборе документа HTML-парсер передает управление интерпретатору после того, как встретит тег начала контейнера SCRIPT. Интерпретатор получает на исполнение весь фрагмент кода внутри контейнера SCRIPT и возвращает управление HTML-парсеру для обработки текста страницы после тега конца контейнера SCRIPT.

Контейнер SCRIPT выполняет две основные функции:

· размещение кода внутри HTML-документа;

· условная генерация HTML-разметки на стороне браузера.

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

1.7.1 Размещение кода внутри HTML-документа

Собственно, особенного разнообразия здесь нет. Код можно разместить либо в заголовке документа, внутри контейнера HEAD, либо внутри BODY. Последний способ и его особенности будут рассмотрены в разделе "Условная генерация HTML-разметки на стороне браузера". Поэтому обратимся к заголовку документа.

Код в заголовке размещается внутри контейнера SCRIPT:

<HTML>

<HEAD>

<SCRIPT>

function time_scroll()

{

d = new Date();

window.status = d.getHours() +":"+d.getMinutes() +":"

+d.getSeconds();

setTimeout('time_scroll();',500);

}

</SCRIPT>

</HEAD>

<BODY onLoad=time_scroll()>

<CENTER>

<H1>Часы в строке статуса</H1>

<FORM>

<INPUT TYPE=button VALUE="Закрыть окно" onClick=window.close()>

</FORM>

</CENTER>

</BODY>

</HTML>

В этом примере мы декларировали функцию time_scroll() в заголовке документа, а потом вызвали ее как обработчик события load в теге начала контейнера BODY (onLoad=time_scroll()) .

В качестве примера декларации переменной рассмотрим изменение статуса окна-потомка из окна-предка: cоздадим дочернее окно с помощью следующей функции, продекларировав ее, а затем и вызвав:

function sel()

{

id = window.open("","example","width=500,height=200,status,menu");

id.focus();

id.document.open();

id.document.write("<HTML><HEAD>");

id.document.write("<BODY>");

id.document.write("<CENTER>");

id.document.write("<H1>Change text into child window.</H1>");

id.document.write("<FORM NAME=f>");

id.document.write("<INPUT TYPE=text NAME=t SIZE=20

MAXLENGTH=20 VALUE='This is the test'>");

id.document.write("<INPUT TYPE=button VALUE='Close the window'

onClick=window.close()></FORM>");

id.document.write("</CENTER>");

id.document.write("</BODY></HTML>");

id.document.close();

}

<INPUT TYPE=button VALUE="Изменить поле статуса в окне примера"

onClick="id.defaultStatus='Привет'; id.focus();">

Открывая окно-потомок, мы поместили в переменную id указатель на объект окно id=window.open(). Теперь мы можем использовать ее как идентификатор объекта класса Window. Использование id.focus() в нашем случае обязательно. При нажатии на кнопку "Изменить поле статуса в окне примера" происходит передача фокуса в родительское окно. Оно может иметь размер экрана. При этом изменения будут происходить в окне-потомке, которое будет скрыто родительским окном. Для того чтобы увидеть изменения, надо передать фокус. Переменная id должна быть определена за пределами каких-либо функций, что и сделано. В этом случае она становится свойством окна. Если мы поместим ее внутри функции открытия дочернего окна, то не сможем к ней обратиться из обработчика события click.

1.7.2 Условная генерация HTML-разметки на стороне браузера

Всегда приятно получать с сервера страницу, подстроенную под возможности нашего браузера или, более того, под пользователя. Существует только две возможности генерации таких страниц: на стороне сервера или непосредственно у клиента. JavaScript-код исполняется на стороне клиента (на самом деле, серверы компании Netscape способны исполнять JavaScript-код и на стороне сервера, только в этом случае он носит название LiveWire-код; не путать с LiveConnect), поэтому рассмотрим только генерацию на стороне клиента.

Для генерации HTML-разметки контейнер SCRIPT размещают в теле документа. Простой пример - встраивание в страницу локального времени:

<BODY>

...

<SCRIPT>

d = new Date();

document.write("<BR>");

document.write("Момент загрузки страницы:

"+d.getHours()+":"+d.getMinutes()+":"+d.getSeconds());

document.write("<BR>");

</SCRIPT>

...

</BODY>

1.8 Иерархия классов

Объектно-ориентированный язык программирования предполагает наличие иерархии классов объектов. В JavaScript такая иерархия начинается с класса объектов Window, т.е. каждый объект приписан к тому или иному окну. Для обращения к любому объекту или его свойству указывают полное или частичное имя этого объекта или свойства объекта, начиная с имени объекта старшего в иерархии, в который входит данный объект:

Рис. 1.2.

Сразу оговоримся, что приведенная нами схема объектной модели верна для Netscape Navigator версии 4 и выше, а также для Microsoft Internet Explorer версии 4 и выше. Еще раз отметим, что объектные модели у Internet Explorer и Netscape Navigator совершенно разные, а приведенная схема составлена на основе их общей части.

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

Иногда у разных объектов JavaScript бывают определены свойства с одинаковыми именами. В этом случае нужно четко указывать, свойство какого объекта программист хочет использовать. Например, Window и Document имеют свойство location. Только для Window это место - Location, а для Document - строковый литерал, который принимает в качестве значения URL загруженного документа.

Следует также учитывать, что для многих объектов существуют стандартные методы преобразования значений свойств объектов в обычные переменные. Например, для всех объектов по умолчанию определен метод преобразования в строку символов: toString(). В примере с location, если обратиться к window.location в строковом контексте, будет выполнено преобразование по умолчанию, и программист этого не заметит:

<SCRIPT>

document.write(window.location);

document.write("<BR>");

document.write(document.location);

</SCRIPT>

Однако разница все-таки есть, и довольно существенная. В том же примере получим длины строковых констант:

<SCRIPT>

w=toString(window.location);

d=toString(document.location);

h=window.location.href;

document.write(w.length);

document.write(d.length);

document.write(h.length);

</SCRIPT>

Результат исполнения получите сами.

Как легко убедиться, при обращении к свойству объекта типа URL, а свойство location как раз является объектом данного типа, длина строки символов после преобразования будет другой.

2. Программируем свойства окна браузера

Класс объектов Window -- это самый старший класс в иерархии объектов JavaScript. К нему относятся объект Window и объект Frame. Объект Window ассоциируется с окном программы-браузера, а объект Frame -- с окнами внутри окна браузера, которые порождаются последним при использовании автором HTML-страниц контейнеров FRAMESET и FRAME.

При программировании на JavaScript чаще всего используют следующие свойства и методы объектов типа Window:

Таблица 2.1.

Свойства

Методы

События

status

open( )

Событий нет

location

close( )

history

focus( )

navigator

Страницы: 1, 2, 3, 4


© 2003-2013
Рефераты бесплатно, курсовые, рефераты биология, большая бибилиотека рефератов, дипломы, научные работы, рефераты право, рефераты, рефераты скачать, рефераты литература, курсовые работы, реферат, доклады, рефераты медицина, рефераты на тему, сочинения, реферат бесплатно, рефераты авиация, рефераты психология, рефераты математика, рефераты кулинария, рефераты логистика, рефераты анатомия, рефераты маркетинг, рефераты релиния, рефераты социология, рефераты менеджемент.