HTML, XHTML и CSS на 100%

Резюме

В этой главе дано общее описание фундаментальных составляющих языка JavaScript: переменных, выражений, операций, объектов, функций и событий. Именно эти знания являются основополагающими, без них невозможно владение языком сценариев. Кроме того, в настоящей главе приведены данные о свойствах и методах всех встроенных объектов JavaScript. Эту информацию необязательно запоминать, но можно использовать как справочную, так как начинающему программисту она нужна в ограниченном объеме. Данная глава охватывает, возможно, слишком много понятий и может показаться вам сложной. Можете вернуться к ней позднее, чтобы закрепить новые знания.

Глава 12 Первый сценарий на JavaScript

12.1. Организация рабочего окружения

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

12.3. Вводим первый сценарий

12.4. Разбор нашего сценария в среде FrontPage

12.5. Отладка сценария в Microsoft Script Editor

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

12.1. Организация рабочего окружения

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

Текстовые редакторы

Для работы над сценариями подойдет практически любой текстовый редактор, позволяющий создавать обычные текстовые файлы и сохранять их в формате HTM или HTML. Например, в операционной системе Windows в числе стандартных есть два подходящих текстовых редактора – это Блокнот и WordPad. Отдельно стоит отметить редактор Microsoft Word из пакета Microsoft Office – он никак не подойдет для создания сценариев. По умолчанию данный редактор сохраняет свои файлы в двоичном виде, которые ничего общего с веб-страницами не имеют. Хотя можно сохранять его файлы и как веб-страницы, он не позволяет напрямую работать с кодом страниц, а значит, вы не сможете создавать в нем сценарии.

Существуют редакторы, специально разработанные для создания веб-страниц, например Microsoft FrontPage или Adobe Dreamweaver (ранее известный как Macromedia Dreamweaver). Такие редакторы позволяют создавать веб-страницы с помощью визуальных инструментов, а затем уже переключаться в режим отображения кода и вносить какие-либо нестандартные изменения, например добавлять сценарии. Если же создавать с их помощью обычные веб-страницы сможет даже пользователь, не владеющий языком разметки HTML, то вносить изменения в режиме работы с кодом сможет только человек, хотя бы немного знакомый с этим языком. По этой причине пользователям, еще только начинающим разбираться с HTML, следует применять данные редакторы лишь в режиме работы с кодом, чтобы полностью контролировать ход создания веб-страниц. По сравнению с обычными текстовыми редакторами в Microsoft FrontPage или Adobe Dreamweaver синтаксис языков HTML и JavaScript подсвечивается. Таким образом, в них будет удобно работать над сценариями.

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

Браузеры

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

В основном веб-разработчикам приходится считаться с особенностями браузера Internet Explorer, который не слишком стремится к стандартам. Поэтому обязательно тестируйте свои веб-страницы на данном браузере, присутствующем в каждой версии операционной системы Windows. Большой популярностью также пользуются браузеры Mozilla Firefox и Opera, которые стремятся максимально соответствовать стандартам. Вообще можно встретить и другие браузеры, например Konqueror у пользователей операционной системы Linux или Safari у пользователей операционной системы Mac OS. Что касается браузеров от независимых производителей, то они стараются строго соответствовать стандартам, избегая фирменных возможностей браузеров компаний Microsoft и Netscape. Можно прийти к выводу, что для проверки работоспособности своих сценариев будет вполне достаточно трех браузеров: Internet Explorer, Mozilla Firefox и Opera. Причем первый из перечисленных браузеров есть у всех пользователей операционной системы Windows, а следующие два можно без проблем загрузить из Интернета. Браузер Mozilla Firefox можно загрузить с сайтаа Opera – с сайтаКроме того, не все пользователи работают с последними версиями браузеров, поэтому для максимального охвата интернет-аудитории может потребоваться тестирование документов на младших версиях указанных браузеров.

Отладчики сценариев JavaScript

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

Стоит отметить, что для программистов на таких языках, как, например, C++ или Java, отладчики стали таким же обычным и привычным инструментом, как, например, текстовый редактор. А вот для разработки сценариев на JavaScript отладчики применялись не всегда ввиду того, что сценарии, как правило, имели небольшой размер и малую сложность и поэтому могли быть проверены и вручную. Однако в настоящее время сценарии на JavaScript, особенно с использованием технологии AJAX, уже не уступают по объему кода и сложности программам, написанным на таких языках, как C++ или Java. Поэтому все чаще и чаще при разработке сценариев на JavaScript применяют отладчики. Кроме того, если вы в дальнейшем при разработке своих сценариев на JavaScript столкнетесь с какой-либо ошибкой или неправильной работой сценария, умение пользоваться отладчиком сэкономит вам немало времени и труда.

Существует немало отладчиков для сценариев на 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: (со знаком:). Рассмотрим пример такой гиперссылки: