Сделайте резервную копию полученной дискеты и особенно содержащихся в ней HTML-файлов, поскольку они в процессе выполнения лабораторной работы будут изменяться.
Изучите Методические указания или соответствующие разделы пособий [1,2].
Изучите структуру Web-страницы (Файл Листинг 5_1.htm), содержащей сценарий, выполняющийся в момент загрузки страницы, то есть когда на экране еще не видно ее содержания. При нажатии на эту ссылку вы увидите шаблон Web-страницы, содержащей простейший сценарий. Проделайте следующие действия.
3.1. На вкладке Вид браузера Microsoft Internet Explorer укажите режим В виде HTML. Вы увидите страничку Блокнота, содержащую HTML-код рассматриваемой Web-страницы.
3.2. Изучите HTML-код и сравните его с видом страницы, которую вы наблюдаете в окне браузера
3.3. Используя Блокнот в качестве Редактора, внесите изменения в HTML-код страницы, изменив ее заголовок (Элемент <TITLE>), назвав ее Мой первый сценарий.
Внесите такие изменения, чтобы сценарий выводил текст:
"Студент гр.______ ФамилияИмяотчество приветствует вас на этой странице!",
а сама страница вместо текстов З а г о л о в о к и Пустая страница сдержала текст:
Домашняя страница ФамилияИмяотчество.
Измените фон страницы. Цвет шрифта текста, выводимого скриптом, должен соответствовать цвету ваших волос, а цвет шрифта текста страницы - цвету ваших глаз. Сохраните файл Листинг 5_1.htm, нажмите кнопку Обновить браузера и убедитесь, что внесенные изменения работают.
Аналогичные изменения внесите в Web-страницу (Файл Листинг 5_2.htm) и убедитесь, что внесенные изменения работают. Здесь тот же самый сценарий выполняется другим способом: создана функция, которая и связана с событием. Загрузка страницы соответствует событию onload элемента BODY
Изучите структуру Web-страницы (Файл Листинг 5_3.htm), содержащей один из самых модных сценариев, обеспечивающий замену одного рисунка другим в тот момент, когда над рисунком появляется указатель мыши. Таким способом можно изменять вид надписи (текст или фон), вводить изображения нажатой и отпущенной кнопки, создавать всевозможные визуальные эффекты, “оживляющие” страницу. Проделайте следующие действия.
5.1. Внесите такие изменения, чтобы вместо рисунка:
был бы рисунок с вашей фамилией, а вместо рисунка:
был бы рисунок с вашим именем.
Вместо рисунка:
был бы рисунок с текстом Студенческая группа, а вместо рисунка:
был бы рисунок с текстом Шифр группы.
5.2. При нажатии на первую клавишу должны выводиться ваши краткие
автобиографическиеданные, а при нажатии на вторую - краткие сведения о вашей
студенческой группе
5.3. В файле Листинг 5_3.htm тексты: Заголовок, Тема 1, Тема 2 и т. д. необходимо заменить на:
Домашняя страница ФамилияИмяотчество.
Измените фон страницы и цвет шрифта текста.
5.4. Используя данный сценарий, внесите соответствующие изменения в файлы:
main.htm, frame1.htm;
right1.htm ,right2.htm;
right3.htm,
описывающие вашу домашнюю Web-страницу и включающие ваши реквизиты, внесенные изменения и формы (См. л. р. №2).
Изучите структуру Web- станицы (Файл Листинг 5_4.htm), содержащей элементы абзаца и заголовка. Для заголовка запрограммированы события мыши так, чтобы цвет и содержание текста изменялись в зависимости от положения указателя.
6.1. Внесите такие изменения, чтобы вместо текста Заголовок был текст:
Домашняя страница ФамилияИмяотчество.
Измените фон страницы и цвет шрифта текста.
6.2. . Используя данный сценарий, внесите соответствующие изменения в файлы:
main.htm, frame1.htm;
right1.htm ,right2.htm;
right3.htm,
описывающие вашу домашнюю Web-страницу и включающие ваши реквизиты, внесенные изменения и формы (См. л. р. №2).
7. Изучите структуру Web-страницы (Файл Листинг 5_5.htm), иллюстрирующей использование реально действующих часов и метода setTimeout, без которого реализация многих динамических эффектов оказывается невозможной.
7.1. Используя данный сценарий, внесите соответствующие изменения в файлы:
main.htm, frame1.htm;
right1.htm ,right2.htm;
right3.htm,
описывающие вашу домашнюю Web-страницу и включающие ваши реквизиты, внесенные изменения и формы (См. л. р. №2).
8. Изучите структуру Web-страницы (Файл Листинг 5_6.htm), иллюстрирующей управление формами. В листинге 5_6 приведен пример страницы с двумя кнопками, которые управляют содержимым элемента TEXTAREA.
8.1. Используя данный сценарий, внесите соответствующие изменения в файлы:
main.htm, frame1.htm;
right1.htm ,right2.htm;
right3.htm,
описывающие вашу домашнюю Web-страницу и включающие ваши реквизиты, внесенные изменения и формы (См. л. р. №2).
