Язык сценариев JavaScript. Теоретические основы веб

Негосударственное образовательное учреждение
«Открытый молодёжный университет»
КОМПЛЕКСНАЯ ОБРАЗОВАТЕЛЬНАЯ ПРОГРАММА
«ШКОЛЬНЫЙ УНИВЕРСИТЕТ»
УТВЕРЖДАЮ
Директор
Негосударственного образовательного учреждения
«Открытый молодёжный университет»
_______________ И. В. Дмитриев
«___»__________ 2012 г.
Основы сайтостроения
Билеты для проведения дифференцированного зачёта
«Язык сценариев JavaScript. Теоретические основы веб-дизайна»
Томск — 2012
Кравченко С. В. Основы сайтостроения : Билеты для проведения дифференцированного
зачёта «Язык сценариев JavaScript. Теоретические основы веб-дизайна». — Томск : НОУ
«Открытый молодёжный университет», 2012. — 10 c.
Билеты для проведения дифференцированного зачёта рассмотрены и рекомендованы
к изданию на методическом семинаре Негосударственного образовательного учреждения «Открытый молодёжный университет» и Образовательного центра «Школьный
университет» 26 августа 2012 года.
ОГЛАВЛЕНИЕ
ПОЯСНИТЕЛЬНАЯ ЗАПИСКА ............................................................................................. 4
Билет № 1 .............................................................................................................................. 5
Билет № 2 .............................................................................................................................. 5
Билет № 3 .............................................................................................................................. 6
Билет № 4 .............................................................................................................................. 6
Билет № 5 .............................................................................................................................. 7
Билет № 6 .............................................................................................................................. 7
Билет № 7 .............................................................................................................................. 8
Билет № 8 .............................................................................................................................. 8
Билет № 9 .............................................................................................................................. 9
Билет № 10 ............................................................................................................................ 9
Теоретическая база для ответов на вопросы части А ..................................................... 10
3
ПОЯСНИТЕЛЬНАЯ ЗАПИСКА
С помощью предлагаемых билетов можно оценить уровень освоения материала по второй части курса «Основы сайтостроения», включающей темы «Язык сценариев JavaScript»
и «Теоретические основы веб-дизайна».
Цель зачёта — закрепить теоретические знания по указанным темам и сформировать
практические навыки по теме «Язык сценариев JavaScript».
Билеты составлены в десяти вариантах. Каждый вариант состоит из двух частей: А и В.
Часть А содержит два теоретических вопроса, часть В — практическое задание.
Предполагается, что части А и В каждого билета выдаются учащимся последовательно.
Сначала учащиеся получают теоретические вопросы (часть А), готовятся по ним и устно
сдают теорию. Затем выдаются практические задания (часть В), которые учащиеся выполняют за компьютером. При подготовке к устном ответу пользоваться справочными материалами запрещено, при выполнении же практического задания разрешается использование
учебного пособия и интерактивного электронного учебника.
Допускается проводить теоретическую и практическую части зачёта в разное время.
При выполнении учащимися итогового проекта по курсу, практическую часть зачёта можно
не проводить вовсе.
К документу прилагается таблица, в которой указаны параграфы учебного пособия или
разделы интерактивного электронного учебника, содержащие ответы на поставленные в билетах вопросы. Тем не менее, нужно учитывать, что вопросы предполагают свободный ответ.
Развёрнутый ответ, изложенный своими словами, даже приветствуется.
При сдаче практической части зачёта учащиеся должны не только создать веб-страницу
в соответствии с заданием, но и пояснить учителю написанный ими программный код. Использование языка сценариев JavaScript при выполнении всех практических заданий — обязательно.
Система оценивания дифференцированного зачёта: каждый вопрос оценивается по пятибалльной системе. Общая оценка за зачёт выводится как среднее арифметическое из полученных оценок, при этом она может быть чуть завышена или, наоборот, снижена с учётом
успехов или неудач учащегося при освоении второй части курса.
4
БИЛЕТ № 1
Часть А
1. Перечисли все события языка JavaScript, с которыми ты знаком. Опиши события
Load, Unload, KeyPress, KeyDown и KeyUp. Когда они происходят?
2. Перечисли основные стили веб-дизайна. Дай каждому из стилей характеристику.
Часть B
Создай веб-страницу, на которой расположены однострочный редактор (текстовое поле) и кнопка, созданные тегами <input>. Кнопка содержит заголовок «ОК».
При нажатии на кнопку, с помощью метода alert должно отображаться целое случайное число от 0 до значения, введённого в однострочный редактор.
БИЛЕТ № 2
Часть А
1. Перечисли стандартные функции языка JavaScript, предназначенные для взаимодействия с пользователем. Запиши общий вид этих функций. Поясни, как каждая
из них работает.
2. Опиши основные особенности веб-графики.
Часть B
Создай веб-страницу, на которой расположен произвольный текст. Текст должен быть
выровнен по правому краю и иметь зелёный цвет.
Если на данном тексте пользователь щёлкает мышью, то текст выравнивается по центру и становится красного цвета.
5
БИЛЕТ № 3
Часть А
1. Перечисли все события языка JavaScript, с которыми ты знаком. Опиши события
MouseMove, MouseOver, MouseOut. Когда они происходят?
2. Перечисли основные элементы дизайна сайта. Какие рекомендации существуют
по оформлению каждого из них?
Часть B
Создай веб-страницу, на которой расположен заголовок «Привет!».
Если на данном заголовке пользователь дважды щёлкает мышью, то текст заголовка
меняется на «Пока!».
БИЛЕТ № 4
Часть А
1. Перечисли все события языка JavaScript, с которыми ты знаком. Опиши события
Click, DblClick, MouseDown и MouseUp. Когда они происходят?
2. Перечисли основные принципы веб-дизайна. Поясни, чем они обоснованы.
Часть B
Создай веб-страницу, на которой размести однострочный редактор (текстовое поле),
кнопку «Опубликовать» и пустой абзац (<p>).
После того как пользователь вводит в однострочный редактор какой-нибудь текст
и нажимает кнопку «Опубликовать», в абзаце должно появляться содержимое однострочного
редактора, а сам однострочный редактор должен очиститься.
6
БИЛЕТ № 5
Часть А
1. Объясни своими словами, что такое динамический HTML (DHTML). Какие технологии в него входят? Приведи примеры эффектов на страницах, которые можно создавать при помощи динамического HTML.
2. Опиши процесс проектирования дизайна сайта.
Часть B
Создай веб-страницу, на которой расположены однострочный редактор и кнопка, созданные тегами <input>. Кнопка содержит заголовок «Отправить».
После того как пользователь вводит в однострочный редактор какой-нибудь текст
и нажимает кнопку «Отправить», с помощью метода alert должно выводиться сообщение
«Отправлено», а однострочный редактор должен очиститься.
БИЛЕТ № 6
Часть А
1. Перечисли все события языка JavaScript, с которыми ты знаком. Опиши события
Focus, Blur, Change и Select. Когда они происходят?
2. Что такое баннер? Какие форматы баннеров ты знаешь?
Часть B
Создай веб-страницу, при загрузке которой с помощью метода prompt у пользователя
запрашивается целое число от 10 до 25. После этого на страницу должно быть выведено случайное целое число в диапазоне от 0 до введённого пользователем числа.
7
БИЛЕТ № 7
Часть А
1. Что такое функция в языке JavaScript? Опиши формат функции, из каких элементов
она состоит? Приведи пример записи произвольной функции.
2. Из каких этапов состоит веб-дизайн? Опиши, что делается на каждом из них.
Часть B
Создай веб-страницу, на которой содержится форма для выяснения пола пользователя.
Она должна содержать переключатели с метками «мужской» и «женский», а также кнопку
«Ответить».
Когда пользователь указывает свой пол и нажимает кнопку «Ответить», фон страницы
должен окраситься в розовый или синий цвет, в зависимости от указанного пола.
БИЛЕТ № 8
Часть А
1. Какие способы подключения кода на языке JavaScript к документу HTML ты знаешь? Выскажи своё мнение о том, в каких случаях следует использовать каждый
из способов.
2. Опиши стандартное поведение пользователей при просмотре веб-страниц. Какие
принципы веб-дизайна, по твоему мнению, были выработаны на основе наблюдений за пользователями?
Часть B
Создай веб-страницу, на которой размещён произвольный текст. Шрифт текста обычный, зелёного цвета.
Когда пользователь наводит на текст указатель мыши, он окрашивается в красный цвет
и становится жирным. Когда убирает указатель с текста, он принимает своё первоначальное
состояние.
8
БИЛЕТ № 9
Часть А
1. Объясни своими словами, почему язык сценариев JavaScript считается «безопасным» языком программирования.
2. Перечисли базовые элементы дизайна. Дай им определение.
Часть B
Создай веб-страницу, содержащую пустой блок (300 на 300 пикселей), окружённый
цветной рамкой.
При наведении курсора мыши на этот блок в нём должна появляться надпись «Привет!», а при щёлчке в пределах этого блока в нём должна появляться надпись «Ой, зачем вы
меня щекочете?».
БИЛЕТ № 10
Часть А
1. Перечисли все события языка JavaScript, с которыми ты знаком. Опиши событие
Resize. Когда оно происходит?
2. Перечисли принципы построения гармоничной композиции в дизайне. Приведи
примеры, каким образом может быть достигнут тот или иной принцип в композиции (приводить примеры для всех принципов не обязательно).
Часть B
Создай веб-страницу, которая приветствует пользователя при загрузке и прощается
с ним, когда он закрывает страницу. Используй для этого метод alert.
9
ТЕОРЕТИЧЕСКАЯ БАЗА ДЛЯ ОТВЕТОВ НА ВОПРОСЫ ЧАСТИ А
Билет № 1
Билет № 2
Билет № 3
Билет № 4
Билет № 5
Билет № 6
Билет № 7
Билет № 8
Билет № 9
Билет № 10
Вопрос 1
5.3. События JavaScript
5.5. Взаимодействие с пользователем
5.3. События JavaScript
5.3. События JavaScript
5.6. Основы Dynamic HTML (DHTML)
5.3. События JavaScript
5.4. Функции JavaScript
5.2. Размещение кода JavaScript
5.1. Что такое JavaScript
5.3. События JavaScript
10
Вопрос 2
6.5. Стили веб-дизайна
6.7. Особенности веб-графики
6.6. Проектирование дизайна сайта
6.2. Основные принципы веб-дизайна
6.6. Проектирование дизайна сайта
Справка к уроку 15
6.1. Что такое веб-дизайн
6.2. Основные принципы веб-дизайна
6.3. Базовые элементы дизайна
6.4. Принципы создания композиции