- •Методические указания по выполнению лабораторных работ
- •Задание
- •Часть вторая
- •Задание
- •Часть третья
- •Задание
- •Часть четвертая
- •Рассморим скрипт
- •Задание
- •Лабораторная работа № 2
- •Разбор скрипта
- •Задание
- •Команды и эффекты
- •Задание
- •Лабораторная работа № 3
- •Рассмотрим скрипт.
- •Разбор скрипта
- •События onMouseOut и onUnload
- •Разбор скрипта
- •Задание
- •Лабораторная работа № 4
- •Разбор скрипта
- •Продолжаем рассматривать работу с окнами. Скрипт
- •Разбор скрипта
- •Задание
- •Лабораторная работа № 5
- •Часть 1
- •Разбор скрипта
- •Часть 2
- •Разбор скрипта
- •Разбор скрипта
- •Задания Задание № 1
- •Задание № 2
- •Задание № 3
- •Лабораторная работа № 6
- •Скрипт:
- •Разбор скрипта
- •Разбор скрипта
- •Разбор скрипта
- •Задания Задание по первой части
- •Задание по второй части
- •Задание по третьей части
- •Начало формы
- •Конец формы
- •Часть вторая
- •Разбор скрипта
- •Часть третья
- •Разбор скрипта
- •Часть четвертая
- •Разбор скрипта
- •Случайное число
- •Лабораторная работа № 8
- •Разбор скрипта
- •Часть вторая
- •Разбор скрипта
- •Задания Задание к первой части
- •Задание ко второй части
Задание по третьей части
Составьте документ HTML с формой aform. В ней должно быть два текстовых поля, одно для геометрической фигуры, другое для цвета, и кнопка. Напишите функцию с переменной, которая содержит слова «Мне нравится ». Когда пользователь нажмет на кнопку, должно всплывать окно со следующей надписью:
Мне нравится геометрическая фигура такого-то цвета. (по результатам тех данных, которые пользователь вводит в форму)
Покажите длину (length) «фигуры».
Начало формы
Ваш любимый цвет: Ваша любимая геометрическая фигура:
Конец формы
Существуют разные решения, например такое:
<script language="javascript"> function say() { var first = document.aform.first.value; var second = document.aform.second.value; var like = "Мне нравится " alert(like + first + " " + second) alert("В названии вашей любимой геометрической фигуры " + document.aform.second.value.length + " букв.") } </script> </head>
<body> <form name="aform"> Ваш любимый цвет: <br> <input type="text" name="first" size="20"><br> Ваша любимая геометрическая фигура: <br> <input type="text" name="second" size="20"></p> <p><input type="button" value="Отослать" onClick="say()"></p> </form>
</body> </html>
Нужно было заменить имена полей на first и second. Потом убрать первую команду alert из прошлого урока, а все остальное почти без изменений.
Лабораторная работа № 7
Часть первая
Рассматривается случайный выбор чисел. Генерируя случайные числа, JavaScript пользуется датой и временем.
Скрипт
<HTML> <HEAD> <SCRIPT LANGUAGE="JavaScript"> function rand() { var now=new Date() var num=(now.getSeconds())%10 var num=num+1 alert(num) } </SCRIPT> </HEAD> <BODY> <h1>Случайное число</h1> <form> <INPUT TYPE="button" VALUE="Случайное число от 1 дo 10" onClick="rand()"> </FORM> </BODY> </HTML>
Разбор скрипта
функция:
function rand() { var now=new Date() var num=(now.getSeconds())%10 var num=num+1 alert(num) }
Случайный выбор числа осуществляется в несколько шагов:
Во-первых, создаем функцию, к примеру, rand().
Потом создаем переменную для метода new Date().
И еще одну переменную, num. Она содержит метод getSeconds(), так как в данном случае мы воспользуемся секундами, чтобы выбрать случайное число. Элемент %10 говорит скрипту, что нужно выбирать из десяти чисел.
JavaScript, как и многие другие компьютерные языки, начинает отсчет с нуля. Таким образом, прибавляя к случайному числу единицу (num=num+1), мы задаем числа не от 0 до 9, а от 1 до 10.
alert показывает число.
Теперь элемент, запускающий функцию:
<form> <INPUT TYPE="button" VALUE="Случайное число от 1 дo 10" onClick="rand()"> </form>
Это обыкновенная кнопка и событие через onClick.
Часть вторая
Рассмотрим команду IF (если), которая дает возможность выбора.
За IF следует условие и указание, что делать, если оно верно. Верным может быть одно условие или несколько. Скрипт знает, где начинаются и кончаются верные условия, потому что они заключены в {фигурные скобки}.
Скрипт
<HTML> <HEAD> <SCRIPT LANGUAGE="JavaScript"> function askuser() { var answer=" " var statement="Отвечай, да или нет" var answer=prompt("Любишь горчицу?") if ( answer == "да") {statement="Я тоже обожаю горчицу!"} if(answer == "нет") {statement="Я тоже горчицу терпеть не могу!"} alert(statement) } </SCRIPT> </HEAD> <BODY> <h2>Горчица</h2> <FORM> <INPUT TYPE="button" VALUE="Жми!" onClick="askuser()"> </FORM> </BODY> </HTML>