МИНИСТЕРСТВО ОБРАЗОВАНИЯ И НАУКИ УКРАИНЫ
ЧЕРНИГОВСКИЙ НАЦИОНАЛЬНЫЙ ТЕХНОЛОГИЧЕСКИЙ УНИВЕРСИТЕТ
КАФЕДРА ИНФОРМАЦИОННЫХ И КОМПЬЮТЕРНЫХ СИСТЕМ
Веб-технологии
«для чайников»
Учебное пособие по выборочной дисциплине
«Веб-технологии»
для сдачи задолженности по минимальным требованиям,
определенным рабочей программой изучения данной дисциплины
для студентов направления подготовки
6.050102 «Компьютерная инженерия»
Обсуждено и рекомендовано
на заседании кафедры
информационных и компьютерных систем, протокол № 1.
от 01.01.2001 г.
Чернигов ЧНТУ 2016
Веб-технології «для чайників». Навчальний посібник з вибіркової дисципліни «Веб-технології» для здачі заборгованості за мінімальними вимогами, визначеними рабочою программою вивчення даної дисципліни для студентів напряму підготовки 6.050102 «Комп’ютерна інженерія»– Чернігів: ЧНТУ, 2016. - 25 с., рос. мовою.
Укладач: Нестеренко Сергій Олександрович, кандидат технічних наук, доцент кафедри інформаційних та комп’ютерних систем
Відповідальний за випуск: Зайцев Сергій Васильович, завідувач кафедри інформаційних та комп’ютерних систем, доктор
технічних наук
Рецензент: Акименко Андрій Миколайович, кандидат фізико-математичних наук, доцент кафедри інформаційних та
комп’ютерних систем Чернігівського національного технологічного університету
СОДЕРЖАНИЕ
СОДЕРЖАНИЕ. 3
1...... ВОПРОСЫ Для сдачи РАЗДЕЛОВ КУРСА «ВЕБ-ТЕХНОЛОГИИ» по минимальным требованиям.. 4
1.1 HTML.. 4
1.2 CSS.. 4
1.3 СЕРВЕР.. 4
1.4 Javascript. 5
1.5 PHP.. 5
1.6 AJAX.. 5
2...... ОТВЕТЫ на ВОПРОСЫ Для сдачи «веб-ТЕХНОЛОГИЙ» по минимальным требованиям.. 6
2.1 HTML.. 6
2.2 CSS.. 8
2.3 Сервер. 11
2.4 Javascript. 13
2.5 PHP.. 16
2.6 AJAX.. 22
2 ВОПРОСЫ Для сдачи РАЗДЕЛОВ КУРСА
«ВЕБ-ТЕХНОЛОГИИ»
по минимальным требованиям
2.1 HTML
а) Является ли язык HTML языком программирования?
б) Какова стандартная структура веб-страницы? Как располагаются на ней теги <html>,<head>,<title>,<body>?
в) Что такое теги? Что такое параметры (атрибуты) тегов? Привести пример тега с его контентом.
г) Написать html-код абзаца, у которого первая буква
д) Написать html-код двухуровневого нумерованого списка.
2.2 CSS
а) Как записывается правило (описание стиля) CSS? Написать пример.
б) Какие три места возможны для записи стилей в веб-сайте? Написать примеры. Какова область действия стиля, описанного в каждом их трёх мест?
в) Что такое «документная объектная модель» (ДОМ) веб-страницы? Нарисовать простой пример. Пояснить на ней понятия «родитель», «сын», «предок», «потомок», «брат».
г) Какие способы комбинирования селекторов применяются в CSS-правилах? Привести три примера.
д) Написать CSS-правило, которое все элементы <div> </div> на странице форматирует желтым фоном.
е) Написать правило, которое форматирует внутренний уровень двухуровневого упорядоченного списка так, что его пункты нумеруются заглавными латинскими буквами.
2.3 СЕРВЕР
а) Как называется «набор правил для обмена сообщениями между браузером и веб-сервером»? Пояснить, как работает это «набор правил».
б) Даны две ситуации. Первая. Пользователь двойным щелчком открывает файл index. html, он открывается браузером и виден его контент.
Вторая ситуация. Тот же файл index. html помещается в папку виртуального хоста myhost. org. Локальный сервер включен. Имя myhost. org вводится в адресную строку браузера, Enter. В браузере опять виден контент файла index. html. Пояснить, что происходит в компьютере в первом и втором случаях.
в) Как настроить сервер, чтобы он считал корневой страницей хоста не только index. html, но и index. php?
г) Какая польза веб-разработчику от наличия на его рабочем компьютере локального веб-сервера?
д) Какую роль в настройке Apache выполняют файлы httpd. conf и. htaccess? Что в способе их использования общего и что различается?
2.4 Javascript
а) Что такое скрипт? Какая программная компонента веб-процесса его исполняет?
б) Компилируется ли код javascript перед исполнением? Каков механизм исполнения скриптов?
в) Как в javascript задается тип переменной? Что такое «динамическая типизация» переменных?
г) Где на веб-странице правильное место для размещения кода javascript-скриптов? Где разместить функцию так, чтобы она вызывалась автоматически после завершения загрузки страницы?
д) Как получить доступ к нужному элементу ДОМ операторами javascript?
2.5 PHP
а) Чем отличаются HTTP-запросы типов GET и POST? Где место размещения передаваемых серверу параметров формы в GET и POST запросе?
б) Как написать и исполнить на компьютере скрипт на языке РНР?
в) Каким образом в окне браузера (на клиентской стороне) проявляются результаты выполнения РНР-скрипта, который исполняется на серверной стороне?
г) Каким образом передаются серверу данные, которые пользователь в браузере вводит в форму? Какова структура «суперглобальных» массивов $_POST и $_GET, как они заполняются значениями и как оттуда читаются данные? Привести пример операторов РНР.
д) Что такое cookies и какая от них польза?
2.6 AJAX
а) Что такое «синхронное» взаимодействие браузера и сервера и что такое «асинхронное» взаимодействие?
б) Какие визуальные эффекты на веб-странице свидетельствуют о происходящих на странице AJAX-взаимодействиях с сервером?
в) В каком формате браузер получает AJAX-ответ от сервера и как этот ответ браузером обрабатывается для получения требуемого визуального результата?
г) Что собой представляет фреймворк JQuery и для чего он предназначен? Какое отношение имеет JQuery к AJAX?
д) Какие существуют способы выбрать на веб-странице объект, обрабатываемый методами JQuery?
3 ОТВЕТЫ на ВОПРОСЫ Для сдачи
«веб-ТЕХНОЛОГИЙ»
по минимальным требованиям
3.1 HTML
3.1.1 Является ли язык HTML языком программирования?
Нет, не является. Это язык разметки текстов. Служебные конструкции этого языка – теги – описывают не действия, а внешний вид того, что включено внутрь тега (это называется контент).
3.1.2 Какова стандартная структура веб-страницы? Как располагаются на ней теги <html>,<head>,<title>,<body>? Написать. Какой смысл этих тегов?
<html>
<head>
<title>Заголовок
</title>
</head>
<body>
КОНТЕНТ СТРАНИЦЫ
</body>
</html>
Смысл тегов такой.
Тег <html> говорит браузеру, что это веб-страница, написанная с соблюдением правил языка HTML, иначе это просто текст.
Тег <head> (секция заголовка веб-страницы) – это место размещения директив и описаний, общих для всей веб-страницы. К примеру, там можно указать используемую кодировку символов, заголовок окна браузера, еще много чего.
Тег <title> размещается только в секции заголовка. Его контент показывается в заголовке вкладки окна браузера, в которой показывается эта веб-страница:
Тег <body> (секция «тела» веб-страницы) – это место размещения контента веб-страницы. Всё, что в секции тела, браузер визуально покажет на экране.
3.1.3 Что такое теги? Что такое параметры (атрибуты) тегов? Привести пример тега с его контентом.
Тег – это директива разметки. Большинство тегов – контейнерные, то есть имеют открывающую часть и закрывающую часть. Параметры (атрибуты) – это дополнительные уточняющие величины, по которым браузер отображает контент тега не с видом «по умолчанию» (задается в настройках браузера), а точно так, как того потребовал веб-программист. Параметры пишут в открывающей части тега. Пример:
Параметр align="center" размещает слова Этот параграф по центру по центру ширины веб-страницы. Параметров у разных тегов множество.
3.1.4 Написать html-код абзаца, у которого первая буква первого слова красная, а все остальные буквы синие.
<p> <span style="color:red;">Б</span> <FONT COLOR="blue"> уквы этого текста синие.</FONT></p>
Показывается так: 
3.1.5 Написать html-код двухуровневого нумерованого списка.
<ol type="1">
<li>Киев
<li>Xарьков
<ol type="A">
<li>Лесковица
<li>Бобровица
<li>Масаны
</ol>
<li>Днепр
</ol>
3.2 CSS
3.2.1 Как записывается правило (описание стиля) CSS? Написать пример.
Синтаксис такой:
селектор { свойство1:значение1; ... свойствоN:значениеN};
Селектор определяет, на какие части веб-страницы будет направлено действие этого правила. Пары «Свойство:значение» определяют внешний вид.
Пример:
P { color: purple; font-weight:bold;}
Это правило отформатирует все теги <p> так: буквы лилового цвета, полужирные.
3.2.2 Какие три места возможны для записи стилей в веб-сайте? Написать примеры. Какова область действия стиля, описанного в каждом их трёх мест?
Место 1. «Строчные» стили. Прямо внутри тега. Пример:
<p style="font-size:14pt"> Абзац оформленный с помощью CSS-правила.</p>
Место 2. «Страничные» стили. Размещаются в секции head веб-страницы. Пример:
<head>
<style type='text/css'>
h1 {color:red;}
p {margin-right:38px;}
div {float:left;}
|
Из за большого объема этот материал размещен на нескольких страницах:
1 2 3 4 |
