HTML, XHTML и CSS на 100%
Шрифт:
// Снимаем маскировку –>
</script>
Таким образом, браузер ранней версии, встретив элемент SCRIPT, проигнорирует его, а содержащийся внутри этого элемента код пропустит, посчитав комментарием.
Здесь стоит обратить внимание, что перед закрывающим комментарием языка HTML (->) стоит еще и комментарий языка JavaScript (//), поскольку иначе при выполнении JavaScript-кода некоторые браузеры могут попытаться выполнить обработку этой строки, а набор символов – > в JavaScript имеет совсем другое значение. Вообще,
Комментарии // и <!– позволяют скрыть строку в коде сценария:
<script>
// Это первый комментарий
// Второй комментарий, далее идет код
Код сценария
<!– Еще один комментарий
Продолжение кода
// Комментарий
</script>
Комментарии могут быть и многостроковыми, что облегчает отладку сценария и позволяет закомментировать проблемный участок кода. Для этой цели используются наборы символов /* и */.
<script>
/* Это
тоже
комментарий */
Код сценария
</script>
Что же делать с браузерами, которые не поддерживают сценарии или такая возможность в них просто отключена? В таких случаях необходимо либо предупредить пользователя, что для просмотра требуется поддержка сценариев, либо заменить код каким-либо вариантом без сценариев. Для этого в языке HTML есть элемент NOSCRIPT, чье содержимое будет использовано при отсутствии поддержки сценариев. Например:
<noscript>
Ваш браузер не поддерживает сценариев JavaScript или их поддержка отключена
</noscript>
Таким образом, можно, например, предупредить пользователя о том, что для просмотра страницы ему необходим браузер с поддержкой JavaScript. Или же можно предоставить пользователю ссылку на версию сайта, адаптированную для старых версий браузеров.
Сценарии могут содержаться в самой веб-странице, как описано выше, а также в отдельном файле. Элемент SCRIPT имеет атрибут src, который должен иметь значение адреса файла со сценарием. Обычно файлы со сценариями JavaScript имеют расширения JS, например файл lib1.js. Таким образом, чтобы подключить к HTML-документу файл lib1.js, необходимо добавить в него следующую строку:
<script type="text/javascript" src="lib1.js"></src>
Использование отдельных файлов под код сценариев позволит вам создавать, например, собственные библиотеки функций и объектов, при необходимости просто подключив к веб-странице файл библиотеки, не создавая каждую функцию заново. Расположение часто используемых функций в одном файле упростит и отладку, и дальнейшее совершенствование сценариев.
Стоит отметить, что обычно объявления всех глобальных переменных, функций, внешних файлов со сценариями помещают
Таким образом, код веб-страницы со сценариями может выглядеть примерно так, как в листинге 12.1. В нем показаны фрагменты кода веб-страницы, касающиеся встраивания сценариев в HTML-документ.
<html>
<head>
<title>Страница со сценариями</title>
<!– Подключаем внешние файлы со сценариями –>
<script type="text/javascript" src="lib1.js"></src>
<!– Глобальные переменные, функции и объекты –>
<script type="text/javascript">
<!– Маскировка сценария
... // Код на JavaScript
// Конец маскировки сценария –>
</script>
</head>
<body>
<noscript>
Ваш браузер не поддерживает сценарии или их поддержка отключена
</noscript>
... <!– Элементы страницы –>
<script type="text/javascript>
<!–
... // Тоже код на веб-странице
//–>
</script>
... <!– Элементы страницы –>
<p onclick="...">Элемент страницы, события которого обрабатываются
... <!– Элементы страницы –>
</body>
</html>
Таким образом, в HTML-документы внедряется код сценариев на JavaScript. Как видите, все довольно просто. Чтобы убедиться в этом, попробуйте создать свой первый сценарий.
12.3. Вводим первый сценарий
Классическим примером в начале изучения любого языка программирования является программа, выводящая сообщение Привет, мир!!!. Вот и мы создадим на JavaScript сценарий, который будет выводить такое сообщение. Чтобы проиллюстрировать возможности отладчика Microsoft Script Debugger, немного усложним пример и выведем не одно сообщение Привет, мир!!! а несколько. Кроме того, в процессе разбора сценария вы увидите, что очень просто изменить количество сообщений, выводимых в документе. Для примера работы в отладчике вмешаемся в ход выполнения сценария, изменив значение переменной-счетчика.
Теперь пора перейти к практике и создать, наконец, первый сценарий. Прежде стоит повторить, что язык JavaScript чувствителен к регистру символов. Это означает, что вам следует внимательно следить за тем, какими буквами вы набираете код сценария. Ведь, например, слова if и If в языке JavaScript – это абсолютно разные слова. Более подробно об этом вы узнаете в следующих главах, а пока достаточно правильно переписать сценарий из листинга 12.2.
1. Запустите текстовый редактор, в котором вы собираетесь создавать свои вебстраницы.