HTML: Популярный самоучитель
Шрифт:
Рис. 12.2. Сообщение о синтаксической ошибке
Эту конкретную ошибку вызвала следующая строка программы (ошибочно использован символ ; вместо , для разделения параметров функции):
prompt(«текст сообщения»;"значение по умолчанию")
Семантическими ошибками являются использование необъявленных переменных, функций, неправильное количество параметров при вызове функций, использование операторов к операндам несовместимых типов и т. д. При отладке программ только с помощью браузера семантические ошибки равносильны
a += 12;
alert(12);
При таком поведении интерпретатора браузера достаточно сложно определить место возникновения ошибки, поэтому приходится прибегать к некоторым уловкам. Например, можно расставлять вызовы функции alert до и после каждого подозрительного места программы.
Глава 13
Динамический HTML
Данная глава предназначена для того, чтобы познакомить вас с применением сценариев для создания динамических HTML-документов на примере языка программирования JavaScript.
13.1. Основы использования сценариев в HTML-документе
Помещение сценария в документ
Для помещения сценария в документ достаточно использовать HTML-элемент SCRIPT. Этот элемент задается парными тегами <SCRIPT> и </SCRIPT> и имеет следующие атрибуты:
• src – URI файла, в котором записан код внешнего сценария;
• type – задает тип содержимого элемента SCRIPT или файла, определенного атрибутом src, принимает значения вида text/язык_сценария (например, text/javascript, text/vbscript);
• language – задает язык сценария (например, javascript или vbscript); при использовании атрибута type этот атрибут излишен.
Элемент SCRIPT может появляться как в заголовке, так и в теле документа произвольное количество раз. Рассмотрим пример внедрения в документ простейшего сценария на JavaScript (язык рассмотрим чуть позже) (пример 13.1).
<!DOCTYPE HTML PUBLIC «-//W3C//DTD HTML 4.01 Frameset//EN»
"http://www.w3.org/TR/html4/frameset.dtd">
<HTML>
<HEAD>
<TITLE>Простейшая страница со сценарием</TITLE>
</HEAD>
<BODY>
<SCRIPT type = "text/javascript">
var date = new Date;
if (date.getHours < 8 || date.getHours > 22)
document.write("<P align = right><FONT color = black><I>Не спится?</I></FONT>");
else if (date.getHours < 11)
document.write ("<P align = right><FONT color = blue><I>Доброе утро </I></FONT>");
else if (date.getHours < 17)
document.write ("<P align = right><FONT color = red><I>Добрый день</I></FONT>");
else document.write ("<P align = right><FONT color = green><I>Добрый вечер</I></FONT>");
</SCRIPT>
<H1>Страница, содержащая сценарий</H1>
Прочий текст страницы...
</HTML>
Участки кода между <SCRIPT> и </SCRIPT>, начинающиеся с document.write, должны быть записаны в одну строку, иначе пример работать не будет. Что же делает сценарий в приведенном
Стоит сказать несколько слов о еще одном HTML-элементе, имеющем отношение к сценариям, – это NOSCRIPT. Этот HTML-элемент задается парными тегами <NOSCRIPT> и </NOSCRIPT> и полезен, когда автор документа хочет подстраховаться на случай, если его документ будет открыт в браузере, не поддерживающем сценарии вообще или не поддерживающем сценарии на используемом языке программирования. Итак, если сценарий не может быть выполнен, то браузер отобразит содержимое элемента NOSCRIPT (в нем может быть, например, гиперссылка на версию документа, не использующую сценарии).
Скрытие сценария
Рассмотрим прием, который часто применяется для того, чтобы браузер, вообще «не знающий» HTML-элемента SCRIPT, не показал пользователю текст сценария. Это может случиться, если сценарий помещен в тело документа.
Для предотвращения возникновения такой ситуации текст сценария помещают в HTML-комментарий следующим образом:
<SCRIPT type = «text/javascript»>
<!–
//Текст программы, помещенной здесь, пользователь не увидит случайно
–>
</SCRIPT>
Браузеры, поддерживающие элемент SCRIPT, должны проигнорировать HTML-комментарий внутри этого элемента (хотя некоторые версии браузера Netscape Navigator не воспринимали сценарий, заключенный в комментарий HTML).
Другим вариантом скрытия, который должен точно работать, является помещение сценария во внешнем файле и подключение его при помощи атрибута src элемента SCRIPT.
13.2. Исполнение сценария
Теперь рассмотрим, как организовать выполнение написанных и внедренных в документ сценариев. Итак, сценарий может исполняться в двух случаях: при загрузке документа и при возникновении события (а также при вызове его интерпретатором, например, по таймеру, но это рассмотрим особо).
Исполнение при загрузке документа
Интерпретатор браузера выполняет операторы языка JavaScript, записанные вне тела какой-либо функции, только один раз по мере загрузке документа. Причем положение HTML-элемента SCRIPT с текстом сценария определяет момент времени, в который сценарий будет выполняться. Так, сценарий в примере 13.1 выполнялся именно до того, как было загружено остальное содержимое документа, поэтому выведенный им текст и появился раньше основного содержимого документа.
Чтобы при загрузке HTML-документа выполнялась какая-либо функция, в нужном месте сценария должен быть записан вызов функции. Так, пример 13.1 можно переписать следующим образом (пример 13.2 сокращен).
...
<BODY>
<SCRIPT type = "text/javascript">
function greeting{
//Те же действия, что и в примере 13.1...
}
//Вызов функции greeting;
</SCRIPT>
<H1>Страница, содержащая сценарий</H1>
Прочий текст страницы...
</HTML>
Если бы в коде сценария не было явного вызова функции greeting, то на странице не появилось бы приветствие.
Реакция на события
Сценарий может быть также запущен браузером при возникновении на странице какого-либо события, с которым сопоставлен сценарий, – обработчика события. Генерацию событий могут вызывать различные действия пользователя: щелчок кнопкой мыши на элементе страницы, наведение указателя мыши на элемент и др.
Для назначения обработчиков события используются атрибуты HTML-элементов, приведенные в табл. 13.1.