HTML, XHTML и CSS на 100%, Квинт Игорь

HTML, XHTML и CSS на 100%

на обложку

Квинт Игорь

Шрифт:

2. Создайте новый текстовый файл.

3. Введите текст вашего первого сценария из листинга 12.2.

Листинг 12.2. Первый сценарий

<html>

<head>

<title>Наш первый сценарий</title>

</head>

<body>

<!–

for (var i = 0; i < 10; i++)

{

document.write("Привет, мир!!!");

}

//–>

</script>

</body>

</html>

4. Сохраните файл, например, с именем script1.html.

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

Итак, если вы ввели все строки без ошибок, как в листинге 12.2, то на экране вашего браузера появится десять сообщений Привет, мир!!! (рис. 12.3).

Рис. 12.3. Первый сценарий, открытый в браузере

При разработке сценариев обычно одновременно открыт и текстовый редактор, в котором создается веб-страница, и несколько браузеров, в которых проверяется работоспособность создаваемой веб-страницы. Таким образом, после внесения и сохранения каких-либо изменений в сценарий достаточно перейти в окно браузера и нажать кнопку Обновить.

Однако удобнее разрабатывать веб-страницы и сценарии в специально созданных для этого редакторах. Поэтому в качестве примера разберем работу первого сценария в среде редактора Microsoft FrontPage.

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

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

Для разработки сценариев в редакторе FrontPage необходимо переключиться в режим Код (рис. 12.4), который позволит не использовать визуальные инструменты, а работать с кодом страницы напрямую.

Рис. 12.4. Разработка сценариев в среде FrontPage

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

Возможно, вы уже догадались, что сообщение Привет, мир!!! выводит следующая строка:

document.write(«Привет, мир!!!»);

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

Чтобы приветствие выводилось несколько раз, используется оператор цикла for языка JavaScript, который вызывает функцию write объекта document до тех пор, пока значение переменной i меньше десяти. Причем с каждым новым повтором значение переменной i увеличивается на единицу.

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

for (var i = 0; i < 10; i++)

В итоге получится строка:

for (var i = 0; i < 20; i++)

Теперь посмотрим, что получилось, просто перейдя в редакторе FrontPage в режим Просмотр (рис. 12.5).

Рис. 12.5. Просмотр работы сценария в среде FrontPage

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

Отладчик Microsoft Script Editor распространяется с редактором Microsoft FrontPage, хотя может быть свободно загружен из Интернета. Данный отладчик применяется совместно с браузером Internet Explorer, а значит в браузере необходимо разрешить отладку.

1. Выберите команду меню Сервис -> Свойства обозревателя. Появится окно Свойства обозревателя.

2. Выберите вкладку Дополнительно. Вы увидите список Параметры.

3. В этом списке снимите, если установлены, флажки Отключить отладку сценариев (Internet Explorer) и Отключить отладку сценариев (Другие).

4. Нажмите кнопку OK, чтобы сохранить изменения.

5. Перезапустите браузер.

Таким образом, в меню Вид должно появиться подменю Отладчик сценариев с двумя командами: Открыть и Прервать на следующей инструкции. Теперь приступим к отладке сценария.

1. Откройте в браузере страницу с первым сценарием (см. листинг 12.2).

2. Выберите команду меню Вид -> Отладчик сценариев -> Прервать на следующей инструкции.

3. Нажмите кнопку Обновить. Возможно, при этом откроется окно выбора одного из отладчиков Microsoft Script Editor и Microsoft Script Debugger. В этом случае выберите Microsoft Script Editor. Откроется главное окно отладчика Microsoft Script Editor (рис. 12.6).

Рис. 12.6. Окно отладчика

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