
- •Web программирование
- •231000.62 – “Программная инженерия”
- •Содержание
- •Введение
- •Дисциплина web программирование имеет целью обучить студентов разработке web - приложений, дать студентам теоретические знания и практические навыки в проектировании и реализации web-сайтов.
- •1. Протоколы и модели Internet-взаимодействия
- •1.1. Протоколы
- •1.2. Модель клиент-сервер
- •1.3. Формат описания адреса
- •2. Статическое web – программирование
- •2.1. Структура html-документа
- •2.2. Работа с текстом
- •2.3. Работа с таблицами
- •2.4. Работа с формами
- •2.5. Работа с фреймами
- •3. Каскадные таблицы стилей (css)
- •3.1. Синтаксис css
- •3.2. Использование css
- •3.3. Свойства css
- •4. Язык xml
- •4.1. Структура xml-документа
- •4.2. Правила создания xml-документа
- •4.3. Конструкции языка xml
- •4.3.1. Элементы данных
- •4.3.2. Комментарии
- •4.3.3. Атрибуты
- •4.3.4. Cпециальные символы
- •4.3.5. Директивы анализатора
- •4.3.6. Cdata
- •5. JavaScript сценарии
- •5.1. Клиентские и серверные сценарии
- •5.2. Операторы и функции JavaScript
- •5.3. Встроенные объекты JavaScript
- •5.4. Динамический html
- •5.5. Ajax технология
- •6. Работа с субд MySql
- •6.1. Особенности
- •6.2. Основные команды
- •7. Php. Динамическое web-программирование
- •7.1. Особенности
- •7.2. Php и объектно-ориентированное программирование
- •8. Проектирование полнофункциональных web-сайтов
- •8.1. Виды сайтов
- •8.2. Этапы проектирования web-сайтов
- •9. Задания для выполнения лабораторных работ
- •Последовательность выполнения задания
- •9.2. Задания для выполнения лабораторной работы №2 «Разработка сайта, содержащего карту-изображение с заданными активными зонами»
- •Варианты
- •Последовательность выполнения задания
- •9.3. Задания для выполнения лабораторной работы №3 «Разработка сайта, содержащего таблицы»
- •Варианты
- •9.4. Задания для выполнения лабораторной работы №4 «Разработка сайта “Электронный тест проверки знаний студентов изучаемых дисциплин”»
- •Варианты
- •Последовательность выполнения задания
- •9.5. Задания для выполнения лабораторной работы №5 «Разработка сайта с динамическими эффектами»
- •Варианты
- •Последовательность выполнения задания
- •9.6. Задания для выполнения лабораторной работы №6 «JavaScript. Горизонтальное и вертикальное меню»
- •Варианты
- •Последовательность выполнения задания
- •2.1 Горизонтальное меню
- •2.2 Вертикальное выпадающее меню
- •2.3 Вертикальное раскрывающееся меню
- •9.7. Задания для выполнения лабораторной работы №7
- •2. Ход работы
- •9.8. Задания для выполнения лабораторной работы №8 «Динамическая поддержка выбора значений из предлагаемого списка»
- •Варианты
- •Последовательность выполнения задания
- •9.9. Задания для выполнения лабораторной работы№9 «MySql. Проектирование базы данных и обеспечение прав доступа»
- •Варианты
- •Последовательность выполнения задания
- •9.10. Задания для выполнения лабораторной работы№10 «Разработка интернет-магазина»
- •Варианты
- •Последовательность выполнения задания
- •10. Контрольная работа
- •10.1. Назначение, цели и задачи контрольной работы
- •10.2. Требования к контрольной работе
- •10.3. Варианты заданий курсовой работы
- •11. Пример программы «Создание динамического эффекта» к выполнению лабораторной работы №5 «Разработка сайта с динамическими эффектами»
- •11.1. Плавное появление и исчезновение текста
- •11.2. Текст, движущийся на наблюдателя
- •11.3. Создание бегущих строк
- •11.4. Волнообразнодвижущийся текст
- •10.5. Текст, прилетающий по частям
- •10.6. Имитация движения текста по кругу в 3 d пространстве
- •10.7. Движение фонового рисунка страницы («летящие звезды», «эффект фейерверка», «падающий снег», «часы со стрелками»)
- •Заключение
- •Список литературных первоисточников
- •231000.62 – «Программная инженерия»
Какую работу нужно написать?
5.3. Встроенные объекты JavaScript
Объекты JavaScriptобъединяют переменные, свойства и функции (методы). Пользователь может создавать свои объекты.JavaScriptсодержит базовые объекты:
Global– набор высокоуровневых свойств и методов, у которых нет родительского объекта.
String– позволяет форматировать и изменять текстовые строки.
Number– дает возможность обрабатывать числа.
Boolen– позволяет создавать логические величины.
Array– дает возможность создавать и управлять массивами.
Function– позволяет создать функции.
Date– дает возможность работать со временем и датой.
Math– предоставляет некоторые математические функции и константы.
RegExp– позволяет выполнять функции регулярных выражений для заданных строк.
Object– является прототипом для всех объектов /10/.
5.4. Динамический html
Динамический HTML(DynamicHTML-DHTML) – способ создания интерактивного веб-сайта.DHTMLвключает языкHTML, каскадную таблицу стилейCSS, языкJavaScript. Объектная модель документа (DocumentObjectModel-DOM) связывает три компонента, придавая документу возможность динамического изменения страницы без перезагрузки. ДинамическийHTMLпредоставляет контрольJavaScriptнад элементами документа, параметрами их оформления и размещения, текстом страницы. Благодаря этому страницы могут динамически менять стили, содержание и оформление. Можно создавать интерактивные документы, взаимодействующие с пользователем в реальном масштабе времени /10/.
Он может быть использован для создания приложения в веб-браузере: например для простой навигации, придания интерактивности форм, динамического перетаскивания элементов по экрану. Также он может служить как инструмент для создания основанных на браузере видеоигр /11/.
В листинге 2.18 приведен пример динамической подсветки ссылок.
Листинг 2.18 Динамическая подсветка ссылок на веб-странице.
<ahref=”javascript:
for (nIx5Bs=0; nIx5Bs<document.all.length; nIxBs++) {
if(document.all[nIx5Bs].tagName==’A’) {
with(document.all[nIx5Bs].style) {
if(backgroundColor==’yellow’){
void(backgroundColor=document.bgColor)}
else {void(backgroundColor=’yellow’)}}}}>
Подсветить ссылки (вкл/выкл)</a> /7/.
5.5. Ajax технология
AJAX (англ. Asynchronous Javascript and XML — «асинхронный JavaScript и XML») — подход к построению интерактивных пользовательских интерфейсов веб-приложений, заключающийся в «фоновом» обмене данными браузера с веб-сервером. В результате, при обновлении данных, веб-страница не перезагружается полностью, и веб-приложения становятся более быстрыми и удобными.
Технология AJAX — не самостоятельная технология, а концепция использования нескольких смежных технологий. AJAX базируется на двух основных принципах:
1. использование технологии динамического обращения к серверу «на лету», без перезагрузки всей страницы полностью, например:
- с использованием XMLHttpRequest (основной объект);
- через динамическое создание дочерних фреймов;
- через динамическое создание тега <script>.
2. использование DHTML для динамического изменения содержания страницы;
В качестве формата передачи данных обычно используются JSON или XML.
Преимущества
1. Экономия трафика
Использование AJAX позволяет значительно сократить трафик при работе с веб-приложением благодаря тому, что часто вместо загрузки всей страницы достаточно загрузить только изменившуюся часть, как правило, довольно небольшую.
2. Уменьшение нагрузки на сервер
AJAX позволяет несколько снизить нагрузку на сервер. К примеру, на странице работы с почтой, когда вы отмечаете прочитанные письма, серверу достаточно внести изменения в базу данных и отправить клиентскому скрипту сообщение об успешном выполнении операции без необходимости повторно создавать страницу и передавать её клиенту.
3. Ускорение реакции интерфейса
Поскольку нужно загрузить только изменившуюся часть, пользователь видит результат своих действий быстрее.
Недостатки
1. Отсутствие интеграции со стандартными инструментами браузера
Динамически создаваемые страницы не регистрируются браузером в истории посещения страниц, поэтому не работает кнопка «Назад», предоставляющая пользователям возможность вернуться к просмотренным ранее страницам, но существуют скрипты, которые могут решить эту проблему /10/.
Другой недостаток изменения содержимого страницы при постоянном URL заключается в невозможности сохранения закладки на желаемый материал. Частично решить эти проблемы можно с помощью динамического изменения идентификатора фрагмента (части URL после #), что позволяют многие браузеры.
2. Динамически загружаемое содержимое недоступно поисковикам (если не проверять запрос, обычный он или XMLHttpRequest)
Поисковые машины не могут выполнять JavaScript, поэтому разработчики должны позаботиться об альтернативных способах доступа к содержимому сайта.
3. Старые методы учёта статистики сайтов становятся неактуальными
Многие сервисы статистики ведут учёт просмотров новых страниц сайта. Для сайтов, страницы которых широко используют AJAX, такая статистика теряет актуальность.
3. Усложнение проекта
Перераспределяется логика обработки данных — происходит выделение и частичный перенос на сторону клиента процессов первичного форматирования данных. Это усложняет контроль целостности форматов и типов. Конечный эффект технологии может быть нивелирован необоснованным ростом затрат на кодирование и управление проектом, а также риском снижения доступности сервиса для конечных пользователей.
4.Требуется включенный JavaScript в браузере /11/.