Открытый образовательный ресурс "Виртуальная школа компьютерных технологий"

Язык cценариев | Пример скрипта для контроля знаний | Регистрация ученика

На предыдущих занятиях мы научились создавать статические Web-страницы, которые можно сравнить с доской объявлений. Если же Вы мечтаете не только информировать о своих достижения, а например, торговать, (не вставая с дивана), придется осваивать технологии!

ВВЕДЕНИЕ

ЗАН-1. Глобальная компьютерная сеть Интернет. Программы просмотра и поиска информации. Структура Web-страницы и сайта.

ЗАН -2. Языки и редакторы разметки текста. Меню программы и типовые решения пакета MS Front Page. Алгоритм создания сайта.

ЗАН-3. Форматирование текста и размещение графики. Гиперссылки и навигация на Web-страницах. Компоновка элементов страницы.
Списки и формы.

ЗАН-4. Публикация Web-сайта на НАРОД.РУ. Яndex–Мастерская. Тестирование и раскрутка. Индексация в поисковых системах. Ключевые слова и метаописание. Оптимизация.

Занятие 5 \ Текущее
Скрипты и сценарии. Примеры модулей контроля и регистрации.

ЗАН-6. Чему и как дистанционно учить? Стандарты IMS. Сравнение классического и дистанционного обучения.

До сих пор, создавая сайты в HTML-кодировке, мы формировали статические Web-страницы.

Динамические страницы, к рассмотрению и созданию которых мы приступаем, могут изменять свой облик в зависимости от действий пользователя или сами по себе.

Для написания динамических страниц используются фрагменты кода, написанные на языке сценариев, например JavaScript, которые имеют отличный от HTML синтаксис. Для отделения фрагментов кода сценариев от остальной части HTML кода, они располагаются между тегами <SCRIPT> и </SCRIPT>.

Язык скриптов JavaScript

Язык интерпретирующего типа JavaScript был создан фирмой NetScape в 1990 годах как расширение языка разметки гипертекстов HTML и предназначался для создания интерактивных сайтов и обработки запросов посетителей. Интерпретаторы языка встроены во все современные броузеры и гипертекстовые редакторы (Front Page, HomeSite).

При использовании языка сценариев возникает дилемма, связанная с архитектурой "Клиент-сервер".

Язык JavaScript создавался как механизм управления страницами на клиентской стороне.

Пример программы:

JavaScript

<title> Пример программы </title>

document.write (Пример программы);

</script>

Совместимость приложений, разработанных средствами языка скриптов JavaScript, обеспечивается принятыми международными стандартами, обязательными для всех типов браузеров.

Кроме языка гипертекстовых подпрограмм JavaScript, создание сценариев возможно с использованием языков Java, PHP, Perl, средств ActiveX, Dynamic HTML, Macromedia Flash.

Пример 1 - Тест контроля знаний Н.Д. Угриновича

(Хакерский пример)

Использовался исходный HTML код тестов, приведенных на компакт-диске учебного пособия
Угринович Н. Информатика и информационные технологии. М.: Лаборатория Базовых Знаний, 2000. - 440 с.
(Московской Институт Повышения Квалификации Работников Образования).

Посмотрим на начальную часть кода в HTML кодировке.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML><HEAD><TITLE>Вариант 1 (углубленный уровень)</TITLE>

<P>

var answ="";

</SCRIPT>

</SCRIPT>

</SCRIPT>

</P>

<H2>Вариант 1</H2>

<H3>Углубленный уровень</H3></FONT></DIV>

...

Мы видим указание на 2 кода сценариев:

</SCRIPT>

</SCRIPT>

</SCRIPT>

Посмотрим на файлы a1_ugl.js и 10.js с помощью редактора WORD PAD

a1_ugl.js	Комментарии
<!--начало сценария var res="2122414323"; <!--конец сценария-->	Последовательность правильных ответов
10.js
<!--начало сценария function test(){ answ=""; with(document){ answ+=control(res.charAt(0), forms[0].q1[0], forms[0].q1[1], forms[0].q1[2], forms[0].q1[3]) ?"1":"0"; answ+=control(res.charAt(1), forms[0].q2[0], forms[0].q2[1], forms[0].q2[2], forms[0].q2[3]) ?"1":"0"; answ+=control(res.charAt(2), forms[0].q3[0], forms[0].q3[1], forms[0].q3[2], forms[0].q3[3]) ?"1":"0"; answ+=control(res.charAt(3), forms[0].q4[0], forms[0].q4[1], forms[0].q4[2], forms[0].q4[3]) ?"1":"0"; answ+=control(res.charAt(4), forms[0].q5[0], forms[0].q5[1], forms[0].q5[2], forms[0].q5[3]) ?"1":"0"; answ+=control(res.charAt(5), forms[0].q6[0], forms[0].q6[1], forms[0].q6[2], forms[0].q6[3]) ?"1":"0"; answ+=control(res.charAt(6), forms[0].q7[0], forms[0].q7[1], forms[0].q7[2], forms[0].q7[3]) ?"1":"0"; answ+=control(res.charAt(7), forms[0].q8[0], forms[0].q8[1], forms[0].q8[2], forms[0].q8[3]) ?"1":"0"; answ+=control(res.charAt(8), forms[0].q9[0], forms[0].q9[1], forms[0].q9[2], forms[0].q9[3]) ?"1":"0"; answ+=control(res.charAt(9), forms[0].q10[0], forms[0].q10[1], forms[0].q10[2], forms[0].q10[3]) ?"1":"0"; //------------------ showResult(); } } function control(k,f1,f2,f3,f4){ if(k==1&&f1.checked)return true; if(k==2&&f2.checked)return true; if(k==3&&f3.checked)return true; if(k==4&&f4.checked)return true; return false; } function showResult(){ var nok=0; var i; var s; for(i=0; i<answ.length; i++) nok+=answ.charAt(i)=='1'?1:0; document.forms[0].S1.value="Количество правильных ответов "+nok+" из "+answ.length+". Загляните в окошко рядом с номером вопроса. Если Вы ответили верно, то мы рады :-)), если Вы ошиблись, мы огорчены :-((."; with(document.forms[0]){ if (answ.charAt(0)=="1") {T1.value=" :-))"} else {T1.value=" :-(("}; if (answ.charAt(1)=="1") {T2 .value=" :-))"} else {T2.value=" :-(("}; if (answ.charAt(2)=="1") {T3.value=" :-))"} else {T3.value=" :-(("}; if (answ.charAt(3)=="1") {T4.value=" :-))"} else {T4.value=" :-(("}; if (answ.charAt(4)=="1") {T5.value=" :-))"} else {T5.value=" :-(("}; if (answ.charAt(5)=="1") {T6.value=" :-))"} else {T6.value=" :-(("}; if (answ.charAt(6)=="1") {T7.value=" :-))"} else {T7.value=" :-(("}; if (answ.charAt(7)=="1") {T8.value=" :-))"} else {T8.value=" :-(("}; if (answ.charAt(8)=="1") {T9.value=" :-))"} else {T9.value=" :-(("}; if (answ.charAt(9)=="1") {T10.value=" :-))"} else {T10.value=" :-(("}; } } <!--конец сценария-->

Поняв, как построен код, несложно построить "свой" тест.

Процедура следующая.

Исходный тест в виде 2 файлов t1_ugl.files и t1_ugl.htm расположен в папке Test1u.

1. Открываем редактор разметки текстов Front Page и загружаем HTML-код из файла t1_ugl.htm

2. Заменяем вопросы на свои.

3. Последовательность правильных ответов в виде цепочки из 10 цифр записываем в файл a1_ugl.js

4. Приводим в тексте изменения - отговорки - отписки за использование исходного кода или договариваемся с Автором.

5. Хакерская процедура завершена!

Литература

1. Н. Угринович. Информатика и информационные технологии. М.: Лаборатория Базовых Знаний, 2000. - 440 с.

2. Сазанов В.М., Фомина М.В. «Компьютер – Базовый Курс», Учебное пособие.
М.: «Виртуальная школа компьютерных технологий» - 2004.

3. Основы Web-технологий. П.Б. Храмцов и др. - М.: "Интернет-Университет Информационных технологий . 2001- 512 с.

4. Каймин В.А. Информатика. учебное пособие. М.: Изд-во РИОР, 2005. -81 с.

Критика подхода

1. Валидность теста.

2. Слабая защищенность от взлома правильной последовательности ответов.

В плюсе: - простота и доступность;

- "визуальное" программирование;

Модуль регистрации Ученика

Приступаем к другой динамической интерактивной компоненте - модулю регистрации ученика.

Ищу партнеров для создания дистанционного курса "Основы информатики и вычислительной техники" | ЭКСТЕРНАТ