- •Методические указания по проведению практических занятий и лабораторный практикум
- •Практические занятия Практическое занятие№1
- •1. Теоретическая часть
- •Лицензионное программное обеспечение имеет ряд преимуществ.
- •Техническая поддержка производителя программного обеспечения.
- •Обновление программ.
- •Законность и престиж.
- •В ногу с техническим прогрессом
- •Профессиональные предпродажные консультации
- •Повышение функциональности
- •2. Задания для самостоятельного выполнения
- •4. Содержание отчёта
- •5. Контрольные вопросы
- •Практическое занятие№2 Работа с запросами sql к удалённому серверу баз данных
- •1. Теоретическая часть
- •2. Методические указания
- •Практическое занятие№3 Изучение возможностей ActiveX для браузера Internet Explorer
- •2. Методические указания
- •Практическое занятие№4 Подключение различных расширений к современным браузерам
- •2. Методические указания
- •Практическое занятие№5 Проверка правильности отображения сайта в различных браузерах
- •Лабораторный практикум Лабораторная работа №1 Служебные утилиты для работы в Интернет. Изучение протокола http
- •1. Теоретическая часть
- •2. Методические указания
- •Ipconfig /ключи
- •1) Утилита ping
- •Утилита traceroute
- •3. Утилита netstat
- •4. Утилита telnet
- •3. Задания для практического выполнения
- •1. Просмотр сетевых настроек
- •4. Содержание отчёта
- •5. Контрольные вопросы
- •Лабораторная работа №2 Структура xml документа. Xml схемы
- •1. Теоретическая часть
- •2. Порядок выполнения лабораторной работы
- •3. Задания для практического выполнния
- •4. Содержание отчёта
- •5. Контрольные вопросы
- •Лабораторная работа №3 Программная обработка xml документов с помощью xml dom
- •1. Теоретическая часть
- •2. Порядок выполнения лабораторной работы
- •3. Задание для практического выполнения
- •4. Содержание отчёта
- •5. Контрольные вопросы
- •Лабораторная работа №4 Форматирование и преобразование xml документа с помощью xsl. Xslt преобразование xml документа
- •1. Теоретический материал
- •2. Порядок выполнения лабораторной работы
- •3. Задание для практического выполнния
- •4. Содержание отчёта
- •5. Контрольные вопросы
- •Лабораторная работа №5. Введение в JavaScript. Программное взаимодействие с html документами на основе dom api
- •1. Теоретическая часть
- •2. Практическая часть
- •3. Задания для практического выполнения
- •4. Содержание отчёта
- •5. Контрольные вопросы
- •Лабораторная работа №6 Клиентские сценарии. Использование регулярных выражений
- •1. Теоретический материал
- •3. Порядок выполнения практической части
- •Лабораторная работа №7 Использование языка JavaScript для работы с формами html
- •Лабораторная работа №8 Использование JavaScript для создания динамического html
- •2. Пример выполнения практической части
- •Лабораторная работа №9 Функции JavaScript. Создание простейшего меню
- •2. Пример выполнения практической части
- •Лабораторная работа №10. Работа с данными и переменными. Арифметические и логические операции. Условные команды
- •2. Порядок выполнения практической части
- •3. Задание для практического выполнения
- •4. Содержание отчёта
- •5. Контрольные вопросы
Лабораторная работа №9 Функции JavaScript. Создание простейшего меню
Цель работы: приобрести практический навык создания меню на WEB-страницах.
1. Теоретическая часть
Элемент управления Menu имеет два режима отображения: статический и динамический. Статическое отображение означает, что элемент управления Menu все время полностью развернут. Отображается вся структура меню, и пользователь может щелкнуть любую часть меню. В динамически отображаемом меню являются статичными только указанные части, тогда как их дочерние пункты меню отображаются, когда пользователь удерживает указатель мыши на родительском пункте.
Элемент управления Menu позволяет легко создавать меню переходов. Этот элемент управления можно настроить на динамическое или статическое отображение и привязать к файлу XML карты веб-узла.
Меню сайта – один из основных функциональных элементов сайта, состоящий из набора ссылок на различные страницы. Каждая такая ссылка называется пунктом меню. Посетитель использует меню как средство навигации.
Сайт может иметь несколько разных типов и видов меню:
Главное меню сайта – содержит ссылки на ключевые страницы сайта.
Часто главное меню - это простой список ссылок, с изменяющимися кнопками при наведении на них курсора.
Дополнительное меню сайта – как правило, представляет собой наиболее сложную структуру.
Имеет иерархическую структуру и бывает 3-х видов:
1. Выпадающее меню - раскрывается (выпадает) при наведении на пункт меню.
2. Раскрывающееся меню - имеет раскрывающуюся структуру по клику на кнопку меню.
3. Раскрытое меню - статическое меню, часто имеет древовидную структуру.
2. Пример выполнения практической части
Допустим необходимо одинаковым образом изменять свойства нескольких однотипных объектов. Например есть несколько ячеек таблицы в которых необходимо поменять цвет фона при наведении мышкой.
Можно написать следующий код для каждой ячейки:
<td style="background-color:mistyrose" onmouseover="this.style.backgroundColor='white' " onmouseout="this.style.backgroundColor='mistyrose'">Главная</td>
Однако так как действия одинаковы можно написать подпрограмму-функцию. Функция написанная один раз может вызываться и выполняться многократно. Функции сокрашают код и упрошают процесс отладки (проверки и исправления кода).
Скрипт с функцией может находиться в разделе <head> между тегами <script> </script> и должен иметь следующий синтаксис:function имя_функции (список аргументов функции)
{
тело функции
}
Таким образом, в разделе <head> мы размещаем функцию
<script type="text/javascript">
function doit(obj, zvet)
{
obj.style.backgroundColor=zvet
}
</script>
Имя данной функции doit, но можно выбрать и другое. В качестве аргументов в данном случае передаются объект, свойство которого нужно изменить и цвет, который нужно присвоить свойству "цвет фона" объекта. В теле функции оператор присваивания:
obj.style.backgroundColor=zvet
Данная функция вызывается следующим образом:
onmouseover="doit(this, 'white')"
указывается событие и после знака равенства в кавычках имя функции, которая должна выполниться если данное событие наступит. После имени функции в скобках указывают передаваемые аргументы объект и цвет фона объекта.
Таким образом, запись кода получается следующая
<table class="navig">
<tr>
<td onmouseover="doit(this, 'white')" onmouseout="doit(this, 'mistyrose')">Главная</td>
<td onmouseover="doit(this, 'white')" onmouseout="doit(this, 'mistyrose')">Лекции</td>
....
</tr>
</table>
Где свойства таблицы определяются с помощью таблицы стилей (определяется класс navig)
<style type="text/css">
.navig {background-color:mistyrose; text-align:center; width:100%; height: 2em;}
</style>
3. Задание для практического выполнения
1. Создайте файл, соответствующий стандарту XHTML 1.1 или XHTML 1.0 Strict
2. Создайте панель навигации
3. Проверьте созданный вами документ на соответствие стандарту
4. Содержание отчёта
1.Название и цель работы
2. Выполненные практические задания 1-3
3. Вывод о проделанной работе
5. Контрольные вопросы
1. Что такое меню сайта?
2. Какие бывают меню?
3. Назовите методы создания меню.