Размещение операторов на странице

Как создаются HTML документы?

HTML – документы могут быть созданы при помощи любого текстового редактора или специализированных HTML – редакторов и конвертеров. Выбор редактора, который будет использоваться для создания HTML – документов, зависит исключительно от понятия удобства и личных пристрастий каждого автора. Например, HTML редакторы, такие, как “Netscape Navigator Gold” компания Netscape позволяют создавать документы графически с использованием технологии WYSIWYG (What You See Is What You Get). С другой стороны, большинство традиционных средств для создания документов имеют конвертеры, позволяющие преобразовывать документы к формату HTML.

Основные положения

Все тэги HTML начинаются с "<" (левой угловой скобки) и заканчиваются символом ">" (правой угловой скобки). Как правило, существует стартовый тэг и завершающий тэг. Для примера приведем тэги заголовка, определяющие текст, находящийся внутри стартового и завершающего тэга иописывающий заголовок документа: <TITLE> Заголовок документа </TITLE>

Завершающий тэг выглядит также как стартовый, и отличается от него прямым слэшем перед текстом внутри угловых скобок. В данном примере тэг <TITLE> говорит WEB-браузеру об использовании формата заголовка, а тэг </TlTLE> - о завершении текста заголовка. Некоторые тэги, такие, как <Р> (тэг, определяющий абзац), не требуют завершающего тэга, но его использование придает исходному тексту документа улучшенную читаемость и структурируемость.

HTML не реагирует на регистр символов, описывающих тэг, и приведенный ранее пример может выглядеть следующим образом: <title> Заголовок документа </title>

Дополнительные пробелы, символы табуляции и возврата каретки, добавленные в исходный текст HTML-документа для его лучшей читаемости, будут проигнорированы WEB-браузером при интерпретации документа. HTML-документ может включать вышеописанные элементы только если они помещенывнутрь тэгов <PRE> и</PRE>. Более подробно о тэгах <PRE> будет написано ниже.

Структура документа

Когда WEB-браузер получает документ, он определяет, как документ должен быть интерпретирован. Самый первый тэг, который встречается в документе, должен быть тэгом <HTML>. Данный тэг сообщает WEB-браузеру, что ваш документ написан с использованием HTML. Минимальный HTML-документ будет выглядеть так:

<HTML>... тело документа... </ HTML>

Рисунок I.

Обратите внимание на картинку, она показывает обязательные тэги.

<html>

Этот тэг должен открывать документ. Если есть открывающий тэг, то должен быть и закрывающий:

</html>

И так всегда по умолчанию. Некоторые тэги, вроде <br>, не требуют закрывающего тэга. Все тэги, расположенные между <head> и </head> - это что-то вроде служебной информации. Например, <title> - заголовок окна. Все тэги, расположенные между <body> и </body> - непосредственное содержание документа.

Заголовочная часть документа <НЕАD>

Тэг заголовочной части документа должен быть использован сразу после тэга <HTML> и более нигде в теле документа. Данный тэг представляет из себя общее описание документа. Избегайте размещать какой-либо текст внутри тэга <HEAD>. Стартовый тэг <HEAD> помещается непосредственно перед тэгом <TITLE> и другими тэгами, описывающими документ, а завершающий тэг </HEAD> размещается сразу после окончания описания документа. Например:

<HTML>

<HEAD>

<TITLE> Список сотрудников </TITLE>

</HEAD>

Технически, стартовые и завершающие тэги типа <HTML>, <HEAD> и<BODY> необязательны. Но настоятельно рекомендуется их использовать, поскольку использование данных тэгов позволяет WEB-браузеру уверенно разделить заголовочную часть документа и непосредственно смысловую часть.

Заголовок документа <TITLE>

Большинство WEB-браузеров отображают содержимое тэга <TITLE> в заголовке окна, содержащего документ и в файле закладок, если он поддерживается WEB-браузером. Заголовок, ограниченный тэгами <TITLE> и </TITLE>, размещается внутри <НЕAD>-тэгов, как показано выше на примере. Заголовок документа не появляется при отображении самого документа в окне.

Как любой язык, HTML позволяет вставлять в тело документа комментарии, которые сохраняются при передаче документа по сети, но не отображаются браузером. Синтаксис комментария:

Комментарии могут встречаться в документе где угодно и в любом количестве.

Тэги тела документа

Тэги тела документа идентифицируют отображаемые в окне компоненты HTML-документа. Тело документа может содержать ссылки на другие документы, текст и другую форматированную информацию.

Тело документа <BODY>

Тело документа должно находиться между тэгами <BODY> и </BODY>. Это та часть документа, которая отображается как текстовая и графическая (смысловая) информация вашего документа

Уровни заголовков <Нх>

Когда пишется HTML-документ, текст структурно делится на просто текст, заголовки частей текста, заголовки более высокого уровня и т.д. Первый уровень заголовков (самый большой) обозначается цифрой 1, следующий - 2, и т.д. Большинство браузеров поддерживает интерпретацию шести уровней заголовков, определяя каждому из них собственный стиль. Заголовки выше шестого уровня не являются стандартом и могут не поддерживаться браузером. Заголовок самого верхнего уровня имеет признак " 1". Синтакс заголовка уровня 1, следующий:

<H1> Заголовок первого уровня </H1>

Заголовки другого уровня могут быть представлены в общем случае так:

<Hx> Заголовок x-го уровня <Hx>

где х - цифра от 1 до 6, определяющая уровень заголовка.

Тэг абзаца <Р>

В отличие от большинства текстовых процессоров, в HTML-документе обычно игнорируются символы возврата каретки. Физический разрыв абзаца может находиться в любом месте исходного текста документа (для удобства его читаемости). Однако браузер разделяет абзацы только при наличии тэга <Р>. Если вы не разделите абзацы тэгом <Р>, ваш документ будет выглядеть как один большой абзац.

Дополнительные параметры тэга <Р>:

<Р АLIGN=1еft | center | right>

позволяют выравнивать абзац по левому краю, центру и правому краю соответственно. Центрирование элементов документа

Вы можете центрировать все элементы документа в окне браузера. Для этого можно использовать тэг <CENTER>. Все элементы между тэгами <center> и </center> будут находиться в центре окна. Соответственно работают теги <LEFT> и <RIGHT>

Тэг преформатирования <PRE>

Тэг преформатирования, <PRE>, позволяет представлять текст со специфическим форматированием на экране. Предварительно сформатированный текст заканчивается завершающим тэгом </РRЕ>. Внутри предварительно сформатированного текста разрешается использовать;

♦ перевод строки

♦ символы табуляции (сдвиг на 8 символов вправо)

♦ непропорциональный шрифт, устанавливаемый браузером

Использование тэгов, определяющих формат абзаца, таких как <Нх> или <ADDRESS>, будет игнорироваться браузером при помещении их между тэгами <PRE> и </PRE>.

Далее идет несколько более подробный пример, собранный из предыдущих:

<HTML>

<HEAD>

<TITLE> Список сотрудников </TITLE>

</HEAD>

<BODY>

<H2> Список сотрудников нашей фирмы </H2>

<H3> Составлено: 30 июля 1996 года </H3>

Данный список содержит фамилии, имена и отчества

Всех сотрудников нашей компании. <P>

Список может быть использован только в служебных целях. <P>

</BODY>

</HTML>

Вот, что вы увидите на экране браузера:

Список сотрудников нашей фирмы Составлено: 30 июля 1996 года

Данный список содержит фамилии, имена и отчества всех сотрудников нашей компании. Список может быть использован только в служебных целях.

Заголовок "Список сотрудников" не отображен браузером как часть документа. Он появится в заголовке окна браузера.

Разры в строки <BR>

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

Алексей Ярцев <BR> Дмитровское шоссе, <BR> д.9Б, офис 326 <BR>

Дополнительный параметр позволяет расширить возможности тэга <BR>. <br CLEAR=left|right|all>

Данный параметр позволяет выполнить не просто перевод строки, а разместить следующую строку, начиная с чистой левой (left), правой (right) или обеих (all) границ окна браузера. Например, если рядом с текстом слева встречается рисунок, то можно использовать тэг <BR> для смещения текста ниже рисунка:

<р> Как вы можете видеть, данная схема демонстрирует связь<BR CLEAR=left>

<img src-"https://www.softexpress.corn/images/schema1.gif" align=baseline> Мастер/Деталь </p>

Неразрывная строка <NOBR>

Если вы не хотите, чтобы браузер автоматически переносил строку, то вы можете обозначить ее тэгами <NOBR> и </NOBR>. В этом случае браузер не будет переносить строку, даже если она выходит за границы экрана; вместо этого браузер позволит горизонтально прокручивать окно. Например;

<NOBR> Данная строка является самой длинной строкой документа, которая не допускает какого-либо разбиения, где бы то ни было </NOBR>

Если же вы хотите все же позволить разбиение данной строки на две, но в строго запланированном месте, то вставьте тэг <WBR> в это место. Например:

<NOBR> Данная строка является самой длинной строкой документа,<WBR> которая не допускает какого-либо разбиения где бы то ни было </NOBR>

Данная строка является самой длинной строкой документа,

которая не допускает какого-либо разбиения где бы то ни было.

Цитата <BLOCKQUOTE>

Данный тэг предназначен для обозначения в документе цитаты из другого источника. Текст, обозначенный тэгом <BLOCKQUOTE>, отступает от левого края документа на 8 пробелов. Например:

На открытии данной конференции глава представительства произнес: <Р> <BLOCKQUOTE>

Сегодня один из величайших дней для нашей компании. <BR>

Мы открыли новую технологию, позволяющую нашим клиентам повысить производитель-кость их настольных систем в несколько раз.

</BLOCKQUOTE>

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

На открытии данной конференции глава представительства произнес:

Сегодня один из величайших дней для нашей компании.

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

Список базовых тэгов HTML

Стартовый	Завершающий	Описание
<HTML>	< /HTML>	Обозначение HTML-документа
<HEAD>	</HEAD>	Заголовочная часть документа
<TITLE>	</TITLE>	Заголовок документа
<BODY>	</BODY>	Тело документа
<H1>	</H1>	Заголовок абзаца первого уровня
<H2>	</H2>	Заголовок абзаца второго уровня
<H3>	</H3>	Заголовок абзаца третьего уровня
<H4>	</H4>	Заголовок абзаца четвертого уровня
<H5>	</H5>	Заголовок абзаца пятого уровня
<H6>	</H6>	Заголовок абзаца шестого уровня
<P	</P	Абзац
<PRE>	</PRE>	Форматированный текст
<BR>		Перевод строки без конца абзаца
<LOCKQUOTE>	</BLOCKQUOTE>	Цитата

Изображения <IMG SRC=путь рисунка>

Поддержка изображений в HTML - путь в мир графики. Создание и манипулирование изображениями, графическими форматами и другим графическим материалом не является частью HTML. В частности, HTML спецификации не объявляют каких-либо требований или ограничений на графические форматы, поддерживаемые Web браузерами. Большинство браузеров могут показывать рисунки X Bitmap (XBM) или GTF формата вместе с текстом.

Поскольку каждый рисунок занимает много времени на отображение на экране (что замедляет показ документа), то мы не рекомендуем Вам включать слишком большое количество или чрезмерно большие по размеру рисунки в Ваш HTML-документ.

Чтобы включить рисунок, надо описать гиперссылку на него: <IMG SRC= путь_рисунка >

где - путь рисунка. gif или.xbm файлы, содержащие рисунок. Автоматически, рисунок выравнивается по нижнему краю сопровождающего его текста, но Вы можете задавать взаимное расположение рисунка итекста:

- это выравнивание по нижнему краю (делается браузером, по умолчанию).

- это выравнивание по верхнему краю

Форматирование положения рисунка задается включением в гиперссылку пункта "ALIGN- ". Например: <IMG ALIGN=top SRC= image _URL>

Также возможны типы выравнивания: ALIGN = MIDDL

ALIGN = CENTER

Некоторые WWW-браузеры не могут показывать рисунки. Такие пользователи смогут увидеть только текст, заданный в пункте гиперссылки "ALT = “. Сопроводительный текст должен быть включен в кавычки. Например:

В этом случае пользователь lynx увидит только текст "logo.gif". C соединение с другими документами <А HREF=" имя файла ”>

Главное преимущество HTML состоит в его способности связываться с другими документами. Браузер выделяет (обычно цветом и/или подчеркиванием) ключевые слова, являющиеся гипертекстовыми ссылками (гиперссылками). Описывается ссылка на другой документ следующим образом:

<А HREF=" имя файла^л> Текст, который будет служить как обращение к другому документу</A>.

Приведем пример такой гипертекстовой ссылки:

<А HREF="minihtml.html">Пример HTML-текста</A>.

Здесь ключевые слова "Пример HTML-текста' являются гиперссылкой на файл minihtml.html, который лежит в той же директории, что и текущий документ. Вы можете ссылаться на документ, лежащий в любой директории, описав к нему полный путь. Так, например, ссылку на файл NJStats.html, лежащий в поддиректории AtlanticStates можно описать как:

<А HREF="AtlanticStates/NJStats.html">New Jersey</A>

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

URL. <A Href="https://www.ssau.ru/index.html'>News</A>

Итак -URL это аббревиатура от Uniform Resource Locator. В него входит, кроме названия файла и директории: сетевой адрес машины и метод доступа к файлу. С помощью URL можно запускать удаленные программы, и передавать им значения. На этом принципе построены шлюзы в другие интернетовские сервиса; finger, archie и т. п.

Если вы внимательно посмотрите на исходники какого-нибудь гипертекстового документа, и обратите внимание на то, как указаны ссылки на другие URL, то заметите, что встречаются два вида:

1. <А Href=" https://www.ssau.ru/mdex.html ">News</A>

2. <AHref=”aaa.html>AAA</A>

Первый - это полный URL, а второй - частичный. Частичный URL указывает на документ, который находится на том же сервере и в той же директории, что и документ в котором встречается эта ссылка.

Обращение к определенным разделам других документов

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

Здесь вы можете увидеть <А "NАМЕ = "Глава 1 ">Главу 1 </а> Текст первой главы.

Теперь, описывая ссылку в документе А, надо включить не только имя файла "documentB.html”нo также и имя гиперссылки, отделяемое символом (#):

Здесь вы можете увидеть текст<А HREF ~ "docurnentB.html#Главаl"> Главы 1 </А> документа В.

Теперь "кликнув" в слово”Uлава 1" в документе А, вы переходите непосредственно в Главу 1 в документе В.

2. Описание языка создания сценариев JavaScript

Язык программирования JavaScript разработан фирмой NetsCape для создания интерактивных HTML-документов. (Фирма Microsoft разработала свой интерпретатор языка JavaScript, который она называет JScript). Это объектно-ориентированный язык разработки встраиваемых приложений, выполняющихся как на стороне клиента, так и на стороне сервера. Клиентские приложения выполняются браузером просмотра Web-документов на машине пользователя, серверные приложения выполняются на сервере. При разработке обоих типов приложений используется общий компонент языка, называемый ядром и включающий определение стандартных объектов и конструкций, и соответствующие компоненты дополнений языка, содержащие специфические для каждого типа приложений определения объектов.

Клиентские приложения непосредственно встраиваются в HTML-страницы и интерпретируются браузером по мере отображения частей документа в его окне. Основные области использования при создании интерактивных HTML-страниц следующие:

♦ Динамическое создание документа с помощью сценария

♦ Оперативная проверка достоверности заполняемых пользователем полей форм
HTML до передачи их на сервер

♦ Создание динамических HTML-страниц совместно с каскадными таблицами сти-
лей и объектной моделью документа

♦ Взаимодействие с пользователем при решении "локальных" задач, решаемых
приложением JavaScript.

Основы JavaScript

Приложение JavaScript представляет набор операторов языка, последовательно обрабатываемых встроенным в браузер интерпретатором. Каждый оператор можно располагать в отдельной строке. В последнем случае разделитель (;), отделяющий один оператор от другого, не обязателен. Его используют только в случае задания нескольких операторов на одной строке. Любой оператор можно расположить в нескольких строках без всякого символа продолжения. Например, следующие два вызова функции alert эквивалентны:

alert("Тест"); или

alert(

"Тест"

);

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

Для удобства чтения кода приложения в нем можно располагать комментарии. Любая последовательность символов, следующая за двумя косыми чертами // до конца строки, рассматривается как комментарий. Для задания многострочных комментариев используется синтаксис, заимствованный из языков Java и С. Любая последовательность символов, заключенная между символами /* и */, интерпретируется как комментарий.

Язык JavaScript чувствителен к регистру.

Основные элементы языка

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

function someFunction()

{

//код функции

}

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

someFunction()

Указание скобок () обязательно даже при вызове функций, которые не имеют параметров. Функции могут иметь любое число параметров, которые перечисляются в скобках. Параметры отделяются друг от друга запятой и пробелом, например: someFunction(2, 4, 1).

Следует также помнить, что в JavaScript различаются символы верхнего и нижнего регистров: someFunction, Somefunction, somefunction - это три различные функции.

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

Определение необходимых функций следует осуществлять в тэге <HEAD>, так как все определенные в нем операторы сценария интерпретируются до отображения страницы, и, таким образом, будут известны в процессе отображения всей страницы.

Функции, как и в любом языке программирования высокого уровня, могут возвращать определенные значения. Для этого используется ключевое слово return. Например:

function someFunction()

{

//код функции

return someValue

//возвращаемое значение

}

Переменные и литералы. Как и в других языках программирования, в JavaScript термин "переменная" означает нечто, значение чего может быть изменено. Переменной может быть число, слово, последовательность символов или любая их комбинация. Для определения переменной используется ключевое слово var:

var x=4 //х присвоено значение 4.

Различают глобальные и локальные переменные. Переменная, объявленная вне функции - глобальная, и ее можно использовать везде в текущем документе. Использование «var »необязательно. Это ключевое слово применяют, когда необходимо иметь локальную переменную с тем же именем, что и у глобальной.

JavaScript поддерживает числовой, строковый, булевый, объектный и некоторые другие типы данных.

Для присваивания переменным значений основных типов применяются литералы - буквальные значения данных соответствующих типов (константы).

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

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

532 // десятичное значение

13 // десятичное значение

0x75 // шестнадцатеричное значение

0xFF // шестнадцатеричное значение

042 // восьмеричное значение

Помимо целочисленных литералов, в JavaScript можно использовать вещественные литералы. Для их задания используется синтаксис чисел с десятичной точкой: 72.0391, 2.1ЕЗ, 4Е-6.

Строковый литерал - последовательность алфавитно-цифровых символов, заключенная в одинарные или двойные кавычки:

str="Строковая переменная",

или

str='Строковая переменная'.

Главное не запутаться в последовательности кавычек при добавлении скриптов непосредственно в HTML-теги.

Для задания ряда специальных символов используются комбинации, называемые escape-последовательностями. Такие комбинации содержат символ "\" и дополнительный символ. Так, для задания кавычек внутри строковых переменных следует использовать комбинацию “\”:

strl = "That\’s OK".

С помощью этого же символа “\” в строковую переменную можно включать управляющие символы:

\r - возврат каретки,

\n - переход на новую строку,

\t - табуляция.

Булевы литералы имеют два значения: true и false, и используются для обработки ситуаций да/нет в операторах сравнения. Помимо цифровых, строковых и булевых значений переменные могут содержать специальное значение null, указывающее на то, что значение данной переменной не определено.

Язык JavaScript не имеет строгой типизации - тип переменной определяется по ее значению, и все необходимые преобразования выполняются автоматически. Например, если переменная а содержит строковое значение "Переменная а = ", а переменная b - числовое значение 342, мы можем присвоить переменной с результат сложения этих двух переменных:

а="Переменная а = "; // строка

b=342; // число

с=а+b; // результат - преобразование к типу "строка" выполняется

// автоматически.

Имена переменных и функций в должны начинаться с буквы ("А" - "Z", "a" -"z") или символа подчеркивания. Последующие символы могут быть буквами, цифрами и рядом других символов.

Размещение операторов на странице

Встроить сценарий JavaScript в HTML-страницу можно несколькими способами:

♦ Задать операторы языка внутри тэга <SCRIPT> языка HTML

♦ Указать файл с кодом JavaScript в параметре SRC тэга <SCRIPT>

♦ Определить обработчик события в тэге HTML

♦ «Адреса» javascript

Использование тэга <SCRIPT>. Для внедрения в HTML-страницу сценария JavaScript в спецификацию языка HTML был введен тэг-контейнер

<SCRIPT>... </SCRIPT>, внутри которого могут располагаться операторы языка JavaScript. Обычно браузеры, не поддерживающие какие-нибудь тэги HTML, просто их игнорируют, анализируя, однако, содержимое пропускаемых тэгов с точки зрения синтаксиса языка HTML, что может приводить к ошибкам при отображении страницы. Во избежание подобной ситуации следует помещать операторы языка JavaScript в контейнер комментария <! —...—>:

<! —

операторы JavaScript

</SCRIPT>

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

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

Задание файла с кодом JavaScript. Тэг <SCRIPT> имеет параметр SRC, позволяющий связать встраиваемый сценарий с внешним файлом, содержащим программный код на языке JavaScript. В качестве значения параметра задается полный или относительный URL-адрес ресурса. Задание закрывающего тэга </SCRIPT> обязательно, независимо от того, заданы или нет операторы внутри тэга. Следующий фрагмент кода связывает документ HTML с файлом-источником, содержащим некоторый набор функций:

<SCRIPT SRC="https://www.mysite.гu/jscript/jsfuncs.js "> [операторы JavaScript]

</SCRIPT>

Обработчики событий. Для совместимости с языками сценариев в некоторые тэги HTML были введены специальные параметры обработки возникающих событий. Значениями этих параметров могут быть операторы языка JavaScript. Обычно в качестве значения задается имя функции, которая вызывается, когда происходит соответствующее событие, определяемое параметром обработки события. Имя параметра начинается с приставки on, за которой следует имя самого события. Например, параметр обработки события Click (щелчок кнопкой мыши) будет иметь имя onClick.

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

Следующий пример демонстрирует задание функции и ее вызов через параметры обработки события элементов формы:

<HEAD>

<! —

function Test ()

{

alert("Вы нажали кнопку!”)

}

//-->

</HEAD>

<BODY>

<FORM>

</BODY>

Адреса javascript. Есть еще один способ встроить JavaScript-код в HTML-файл -

использовать гиперссылку, имеющую адрес специального вида:

<А HREF="javascript:операторы">...</А>

Например, следующая конструкция

<А HREF="javascript:alert('Привет!')">Жми сюда</А>

задает гиперссылку, которая при щелчке мыши вызывает функцию alert ('Привет! ').

Ввод и вывод информации

Вывод информации. Язык JavaScript предоставляет два способа вывода информации: метод alert, с помощью которого можно отображать на экране клиентского браузера небольшие по размеру сообщения - эти сообщения будут появляться в диалоговой панели, содержащей кнопку Ok (панель сообщений). Нажатие этой кнопки приводит к закрытию диалоговой панели. Вот пример вывода простого сообщения;

alert(‘Пример вывода сообщения в панели сообщений’)

</script>

Вторым способом является использование метода write, который предоставляется объектом document. Вызов метода document.write с указанием в качестве параметра строки, которую следует вывести, приводит к отображению текста в окне браузера, например;

document.write('<B><I>Пример вывода сообщения в окно браузера</I></B>')

</script>

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

document.write(‘<В><1>Пример вывода сообщения в окно браузе-

ра</I></B>’)

</script>

В результате строка будет отображаться жирным курсивом. Если строка имеет большую длину, то ее можно разделить на несколько подстрок, объединив их символом "+": <script language="JavaScript">

document.write('Пример вывода длинной строки'+

‘в окно браузера') </script>

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

тода document.write должен располагаться между остальными тэгами, описывающими содержимое страницы секции <BODY>.

Ввод информации. Для ввода информации можно воспользоваться двумя стандартными методами - confirm и prompt. Как и метод alert, рассмотренный выше, эти методы обеспечиваются объектом window, входящим, как и упоминавшийся объект document, в состав объектной модели браузера.

Метод confirm отображает диалоговую панель, содержащую сообщение и две кнопки - Ok и Cancel. Нажатие кнопки Ok возвращает значение true, Cancel - false. Данный метод может использоваться для получения подтверждений от пользователей либо другой информации, которая может быть представлена булевым значением true/false. Например:

if (confirm('Хотите перейти по гиперссылке?’) document.write ('Переход по гиперссылке')

else

document.write('Отмена перехода по гиперссылке')

</script>

Вторым методом, обеспечивающим ввод информации, является prompt. Он выводит диалоговую панель, содержащую текст, строку для ввода текста и кнопки Ok и Cancel. При нажатии кнопки Ok метод prompt возвращает содержимое строки ввода, при нажатии кнопки Cancel - значение null Метод prompt имеет два параметра. Первый задает текст, поясняющий тип информации, которую необходимо ввести, второй - значение по умолчанию. Второй параметр может быть и пустой строкой. Например:

s=prompt('Введите Ваше имя','Иван Петров') document.write(s)

</script>

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

Размещение операторов на странице

Поиск по сайту