- •Государственная морская академия имени адмирала с. О. Макарова
- •Д. Н. Фомин основы разработки веб-страниц
- •Введение
- •1. Общие вопросы разработки веб-страниц
- •1.1. Цели и задачи создания веб-страниц
- •1.2. Основные понятия и пояснения к ним
- •1.3. Основные элементы веб-страницы и файловая структура веб-сайта
- •1.4. Программное обеспечение рабочего места веб-мастера
- •1.4.1. Редактор html-страниц
- •1.4.2. Редакторы графики
- •1.4.3. Браузеры
- •1.4.4. Вспомогательные программы
- •2. Непосредственная работа с html-кодом
- •2.1. Структура html-документа
- •2.2. Основные тэги
- •2.2.1. Заголовки
- •2.2.2. Абзацы и переводы строки
- •2.2.4. Вставка изображений на веб-страницу
- •2.2.5. Маркированные и нумерованные списки
- •2.2.6. Изменение шрифта
- •2.2.7. Горизонтальная линия
- •2.2.8. Комментарии
- •2.3. Вставка специальных символов в html-документ
- •2.4. Таблицы в html
- •2.4.1. Тэги для таблиц, строк и ячеек
- •2.4.2. Таблицы с объединёнными ячейками
- •2.5. Каскадные таблицы стилей (css)
- •2.5.1. Вводные замечания о таблицах стилей
- •2.5.2. Синтаксис таблиц стилей
- •2.5.3. Наследование
- •2.5.4. Контекстные селекторы
- •2.5.5. Способы включения стилевых таблиц в html-документ
- •2.5.6. Приоритет применения таблиц стилей
- •2.5.7. Классы в стилевых таблицах
- •2.5.8. Комментарии в стилевых таблицах
- •2.5.9. Оформление гипертекстовых ссылок
- •2.6. Свободно позиционируемые элементы
- •3. Визуальный редактор веб-страниц Microsoft FrontPage
- •3.1. Интерфейс Microsoft FrontPage
- •3.2. Ввод и редактирование текста в Microsoft FrontPage
- •3.2.1. Базовые средства редактирования
- •3.2.2. Средства отмены и возврата действий
- •3.2.3. Ввод символа, отсутствующего на клавиатуре
- •3.3. Форматирование текста
- •3.3.1. Базовые средства форматирования
- •3.3.2. Списки
- •3.3.3. Вставка изображений
- •3.4. Создание таблиц в Microsoft FrontPage
- •3.4.1. Создание таблицы при помощи панели инструментов.
- •3.5. Каскадные таблицы стилей в Microsoft FrontPage
- •3.5.1. Создание внешней стилевой таблицы
- •3.5.2. Создание внутренней стилевой таблицы
- •3.5.3. Определение стиля внутри тэга
- •3.5.4. Создание пользовательских классов
- •4. Язык сценариев JavaScript
- •4.1. Простейшие сценарии JavaScript
- •4.2. Типы данных в JavaScript
- •4.2.1. Строки
- •4.2.2. Числа
- •4.2.3. Булевы значения
- •4.2.4. Особые типы данных
- •4.3. Переменные в JavaScript
- •4.3.1. Простые переменные
- •4.3.2. Переменные-массивы
- •4.4. Выражения, условия и операции
- •4.4.1. Арифметические операции
- •4.4.2. Операции сравнения
- •4.4.3. Логические операции
- •4.4.4. Операция присваивания
- •4.4.5. Прочие операции
- •4.5. Основные операторы JavaScript
- •4.5.1. Оператор ветвления if…else
- •4.5.2. Операторы цикла
- •4.5.3. Прочие операторы
- •4.6. Функции в JavaScript
- •4.6.1. Объявление и вызов функций
- •4.6.2. Вызов функций JavaScript по событию
- •4.6.3. Передача параметров в функцию и возврат значений из функции
- •4.7. Использование объектов в JavaScript
- •4.7.1. Общие понятия об объектах в JavaScript
- •4.7.2. Использование объекта Math
- •4.7.3. Использование объекта Date
- •4.7.4. Использование объекта String
- •4.8. Использование объектной модели документа
- •4.8.1. Использование объекта document
- •4.8.2. Строки ввода и кнопки
- •4.9. Способы подключения сценария к веб-странице
- •4.9.1. Размещение сценария в отдельном файле
- •4.9.2. Размещение сценария внутри тэга
- •4.10. Примеры анимации на веб-страницах
- •4.10.1. Часы на веб-странице
- •4.10.2. Обратный счётчик
- •4.10.3. Движущийся текст
- •4.10.4. Изменение цвета текста под указателем мыши
- •4.10.5. Смена изображения под указателем мыши
- •4.10.6. Переливающийся текст
- •Литература
- •Приложение 1.
- •Приложение 3. Часто используемые свойства стилевых таблиц
- •Приложение 2. Часто используемые символьные подстановки
4.5.3. Прочие операторы
Оператор continue используется в теле цикла (while, do…while, for или for…in) для досрочного перехода к следующему его проходу. Операторы от continue до конца тела цикла пропускаются.
Пример. Простейший сценарий с использованием continue в цикле for.
for (x = 1; x <= 5; x++)
{
alert (x);
continue;
alert ("Это сообщение вы никогда не увидите!");
}
Этот пример не очень интересен, поскольку вся часть сценария от continue до конца тела цикла становится бесполезной. Поэтому continue используется, как правило, совместно с оператором if для пропуска некоторых операторов при наступлении какого-либо условия, при котором их выполнение нежелательно. Например, мы вычисляем величины, обратные целым числам от –5 до 5 и хотим избежать деления на нуль:
for (x = -5; x <= 5; x++)
{
if (x == 0)
{
continue;
}
alert (1 / x);
}
Оператор break используется для досрочного завершения одного из операторов цикла (while, do…while, for или for…in). Он также часто используется совместно с оператором switch, как показано ниже.
Пример. Если в предыдущем примере заменить оператор continue на break, будут вычислены только величины, обратные отрицательным целым числам от –5 до –1.
Оператор switch. Это оператор множественного ветвления. Он позволяет перейти в различные места в сценарии в зависимости от значения какой-либо переменной.
Обратите внимание, что в отличие от оператора case языка Паскаль, в операторе switch выполняются не только операторы, расположенные от одной метки выбора до следующей, но и все последующие операторы до закрывающей фигурной скобки оператора switch. Чтобы изменить это поведение, нужно в конце выполняемого фрагмента, перед следующей меткой выбора, поставить оператор break.
Пример. Попросим пользователя ввести одну из букв Y или N.
var answer = prompt ("Введите Y или N");
switch (answer)
{
case "Y":
alert ("Вы ввели Y");
break;
case "N":
alert ("Вы ввели N");
break;
default:
alert ("Вы ввели не Y и не N");
}
Оператор default служит для указания действий, которые необходимо выполнить, если значение переменной в операторе switch не совпадает ни с одним из значений, указанных в операторах case.
4.6. Функции в JavaScript
4.6.1. Объявление и вызов функций
До сих пор наши сценарии состояли из операторов, выполняемых последовательно от первого до последнего. Однако, как известно, при большом числе операторов программы следует разделять на подпрограммы. Если большое число операторов записано подряд без структурирования, это может сильно затруднить отладку программы. Это же относится и к сценариям.
В отличие от языка Паскаль, в котором подпрограммы делятся на функции (возвращающие значение) и процедуры (не возвращающие значения), в JavaScript все подпрограммы называются функциями. Функция (function) – это группа операторов, предназначенных для определённой цели и объединённых под общим именем. Синтаксис описания функции следующий:
function имя_функции (список_параметров)
{
операторы;
}
Требования к именам функций такие же, как и к именам переменных (см. п. 4.3). В отличие от языка Паскаль, круглые скобки после имени функции обязательны, даже если она не принимает параметров – в этом случае скобки остаются пустыми. Их отсутствие приводит к ошибке.
Пример. Создадим простейший сценарий с описанием и вызовом функции.
function my_first_function( )
{
alert ("Это моя первая функция!");
}
my_first_function ( );
