Чтение онлайн

на главную - закладки

Жанры

HTML, XHTML и CSS на 100%

Квинт Игорь

Шрифт:

Существует немало отладчиков для сценариев на JavaScript. Например, Microsoft Script Debugger, бесплатно распространяющийся отладчик от компании Microsoft, который можно загрузить по адресуимеет все необходимое для успешной отладки сценариев на JavaScript. При отладке сценариев Microsoft Script Debugger применяется совместно с браузером Internet Explorer. Кроме того, данный отладчик распространяется вместе с редактором Microsoft FrontPage в рамках программы Microsoft Script Editor, которая практически не отличается от Microsoft Script Debugger.

Существуют и другие отладчики (например, для браузера Mozilla Firefox), созданные

в виде расширений. В частности, отладчик Firebug можно загрузить с сайтаПричем если перейти на данную страницу в браузере Mozilla Firefox, то отладчик сразу же будет установлен.

12.2. Внедрение сценариев в HTML-документ

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

• в виде гиперссылки;

• в виде обработчика события;

• в рамках элемента SCRIPT.

Разберем способы встраивания сценариев в веб-страницы по порядку. Начнем с разбора метода встраивания сценария под видом гиперссылки.

Встраивание сценариев в гиперссылку

Как известно, для создания на веб-страницах гиперссылок применяется элемент A, у которого есть атрибут href для указания адреса страницы или файла, куда приведет гиперссылка. Однако вместо адреса данный атрибут может содержать и JavaScript-сценарий, если перед сценарием поставить слово javascript: (со знаком:). Рассмотрим пример такой гиперссылки:

<a href="#">Нажмите сюда</a>

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

alert('Привет, мир!');

Интерпретатор исполняет этот код, в результате чего на экране появляется окно (рис. 12.1).

Рис. 12.1. После перехода по гиперссылке появляется окно

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

Встраивание сценариев для обработки событий

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

Поведение каждого элемента зависит от событий, которые

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

<p onclick="alert('Не нажимать!');">Это простой текст

Элемент P просто объединяет текст в параграфы, однако мы возложили на него еще одну функцию. Определив атрибут onclick, наш текст будет реагировать на щелчок кнопкой мыши (рис. 12.2).

Рис. 12.2. После щелчка кнопкой мыши на тексте появляется сообщение

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

Встраивание сценариев в рамках элемента SCRIPT

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

Например, для указания языка JavaScript:

<script type="text/javascript">

Здесь располагается код сценария

</script>

При использовании сценариев JavaScript можно этот атрибут не указывать, так как значение «text/javascript» является значением по умолчанию.

Кроме того, иногда для указания типа языка используют атрибут language. Так, для указания языка JavaScript 1.0 значение атрибута language должно быть «JavaScript», для JavaScript 1.1 – "JavaScript1. 1", для JavaScript 1.2 – "JavaScript1.2" и т. д. Однако данный атрибут не входит в стандарт, определяющий язык HTML, хотя и распознается большинством браузеров. По этой причине его не рекомендуется употреблять. Стоит заметить, что если значение атрибута language незнакомо браузеру, то содержимое элемента SCRIPT игнорируется.

Если пользователь работает в старой версии браузера, которая не поддерживает JavaScript, то элемент SCRIPT может оказаться неизвестным программе и код сценария будет выведен на экран как обычный текст. Таким образом, необходимо обеспечить маскировку кода сценариев от старых браузеров. Для этого код сценария внутри элемента SCRIPT окружают комментариями языка HTML (<!– и –>):

<script type="text/javascript">

<!– Маскируем код

Здесь располагается код сценария

Поделиться:
Популярные книги

Эпоха Опустошителя. Том I

Павлов Вел
1. Вечное Ристалище
Фантастика:
фэнтези
попаданцы
аниме
5.00
рейтинг книги
Эпоха Опустошителя. Том I

Проблема майора Багирова

Майер Кристина
1. Спецназ
Любовные романы:
современные любовные романы
6.60
рейтинг книги
Проблема майора Багирова

Законы Рода. Том 13

Андрей Мельник
13. Граф Берестьев
Фантастика:
аниме
фэнтези
5.00
рейтинг книги
Законы Рода. Том 13

Газлайтер. Том 15

Володин Григорий Григорьевич
15. История Телепата
Фантастика:
боевая фантастика
попаданцы
5.00
рейтинг книги
Газлайтер. Том 15

О, Путник!

Арбеков Александр Анатольевич
1. Квинтет. Миры
Фантастика:
социально-философская фантастика
5.00
рейтинг книги
О, Путник!

Прометей: каменный век

Рави Ивар
1. Прометей
Фантастика:
альтернативная история
6.82
рейтинг книги
Прометей: каменный век

Её (мой) ребенок

Рам Янка
Любовные романы:
современные любовные романы
6.91
рейтинг книги
Её (мой) ребенок

Идеальный мир для Лекаря 8

Сапфир Олег
8. Лекарь
Фантастика:
юмористическое фэнтези
аниме
7.00
рейтинг книги
Идеальный мир для Лекаря 8

Прометей: каменный век II

Рави Ивар
2. Прометей
Фантастика:
альтернативная история
7.40
рейтинг книги
Прометей: каменный век II

Цвет сверхдержавы - красный. Трилогия

Симонов Сергей
Цвет сверхдержавы - красный
Фантастика:
попаданцы
альтернативная история
8.06
рейтинг книги
Цвет сверхдержавы - красный. Трилогия

Болтливый мертвец

Фрай Макс
7. Лабиринты Ехо
Фантастика:
фэнтези
9.41
рейтинг книги
Болтливый мертвец

На границе империй. Том 9. Часть 2

INDIGO
15. Фортуна дама переменчивая
Фантастика:
космическая фантастика
попаданцы
5.00
рейтинг книги
На границе империй. Том 9. Часть 2

Истребители. Трилогия

Поселягин Владимир Геннадьевич
Фантастика:
альтернативная история
7.30
рейтинг книги
Истребители. Трилогия

Лишняя дочь

Nata Zzika
Любовные романы:
любовно-фантастические романы
8.22
рейтинг книги
Лишняя дочь