JavaScript 3

Категория: Программирование JavaScript Обновлено: 05.06.2019 Опубликовано: 14.04.2019

Пример 1. Подтверждение действия

<SCRIPT type="text/javascript">
if (confirm("Уверены, что хотите посетить эту страницу?") )
{
parent.location='http://www./';
alert("Счастливого пути");
}
else
{
alert("Tогда оставайтесь");
}
</SCRIPT>

-------------------

SCRIPT LANGUAGE="javascript">
function go()
{
if (confirm("Хотите на эту страницу?") )
{
parent.location='http://www.';
alert("Счастливого пути");
}
else
{
alert("Ладно, оставайтесь");
defaultStatus='Что сделано, то сделано';
}}
</SCRIPT>
<BODY onLoad="go()">

 

Пример 2. Простейшее математическое вычисление

<BODY>
<SCRIPT type="text/javascript">
var numsums = 10 + 2
alert("10 + 2 равно " + numsums)
var x = 10
alert("десять — это " + x)
var y = x * 2
alert("10 X 2 = " + y)
var z = "Привет " + "Пока"
alert(z)
</SCRIPT>
</BODY>

----------------

<html>
<head>
<SCRIPT type="text/javascript">
function vars()
{
numsums=10 + 2
alert("10 + 2 is " + numsums)
var x = 10
alert("ten is " + x)
y = x * 2
alert("10 X 2 = " + y)
z = "Привет " + "Пока"
alert(z)
}
</SCRIPT>
</head>
<BODY OnLoad="vars()">
<h1></h1>
</body>
</html>

 

Пример 3. Изменение изображения при наведении мышью

<A HREF="http://www."
onMouseOver="document.pic1.src='on.gif'"
onMouseOut="document.pic1.src='off.gif'">
<IMG SRC="off.gif" BORDER=0 NAME="pic1">
</a>

-------------------------

<p>
<a href="/" onMouseOver="document.pic1.src='bubble2.gif' " onMouseOut="document.pic1.src='bubble1.gif'"><img src="/bubble1.gif" border=0 name="pic1"></a></p>

------------------------

<SCRIPT type="text/javascript">
function up()
{
document.mypic.src="up.gif"
}
function down()
{
document.mypic.src="down.gif"
}
</SCRIPT>
</HEAD>
<BODY>
<A HREF="http://www."
onMouseOver="up()" onMouseOut="down()">
<IMG SRC="down.gif" NAME="mypic" BORDER=0></A>
</BODY>
</HTML>

 

Пример 4. Выбор цвета фона

<html>
<head>
<SCRIPT type="text/javascript">
function newcolor(color)
{
alert("Вы выбрали " + color)
document.bgColor=color
}
</SCRIPT>
</HEAD>
<BODY>
<p>Выберите цвет фона</p>
<FORM>
<INPUT TYPE="button" VALUE="Голубой"
onClick="newcolor('lightblue')">
<INPUT TYPE="button" VALUE="Розовый"
onClick="newcolor('pink')">
</FORM>
</BODY>
</HTML>

------------------------

<html>
<head>
<SCRIPT type="text/javascript">
var user_name = prompt ("Можно узнать, как Вас зовут?","Ваше имя");
function newcolor(color)
{
alert("Эй, " + user_name + "! Вы выбрали " + color)
document.bgColor=color
}
</SCRIPT>
</head>
<body bgcolor="white">
<center><h1>Задайте фон страницы</h1>
</center>
<form>
<input type="button" value="Оранжевый" onClick="newcolor('orange')">
<input type="button" value="Салатовый" onClick="newcolor('lightgreen')">
</form>
</body>
</html>

 

Пример 5. Внедрение поиска от глобальной поисковой системы

<SCRIPT type="text/javascript">
function Gofindit(){
var searchfor = document.formsearch.findthis.value;
{
var FullSearchUrl =
"http://www.yahoo.com/bin/query?p=" + searchfor ;
location.href = FullSearchUrl;
}}
</SCRIPT>
<FORM NAME="formsearch" action="">
Найдите в Yahoo:
<INPUT NAME="findthis" SIZE="40" TYPE="text">
<INPUT TYPE="button" VALUE="Искать"
onClick="Gofindit()">
</FORM>

------------------------

<SCRIPT type="text/javascript">
function Gofindit()
{
alert("Сейчас поищем...");
var search = document.formsearch.find.value;
{
var searchUrl = "http://www.yandex.ru/yandsearch?ctgl=11657&text=" + search;
location.href = searchUrl;
}}
</script>
<form name="formsearch">
Поискать в Яndex:
<input type="button" value="Найти" onClick="Gofindit()">
</form>

 

Пример 6. Количество символов в форме

<HTML>
<HEAD>
<SCRIPT type="text/javascript">
function doit()
{
alert("document.myform.fname.value — это "
+ document.myform.fname.value)
var greeting="Привет "
alert(greeting + document.myform.fname.value
+ " " + document.myform.lname.value)
alert("Длина имени "
+ document.myform.fname.value.length)
}
</SCRIPT>
</HEAD>
<BODY>
<FORM NAME="myform" action="">
Ваше имя?
<INPUT TYPE="text" NAME="fname"><p>
Ваша фамилия?
<INPUT TYPE="text" NAME="lname"><p>
<INPUT TYPE="button"
VALUE="Отправить"
onClick="doit()">
</FORM>
</BODY>
</HTML>

--------------------------

<html>
<head>
<SCRIPT type="text/javascript">
function doit()
{
var greeting="Мне нравится "
alert(greeting + document.aform.city.value
+ " (" + document.aform.state.value +").")
alert
("В названии вашего города " + document.aform.city.value.length
+ " букв.")
}
</script>
</head>
<body >

<form name="aform">
В каком городе вы живете?
<INPUT TYPE="text" NAME="city">
В какой стране?
<INPUT TYPE="text" NAME="state">
<input type="button"
value="Отослать" onClick="doit()">
</form>
</body>
</html>

 

Пример 7. Генерация случайных чисел от секунд

<HTML>
<HEAD>
<SCRIPT type="text/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 до 10"
onClick="rand()">
</FORM>
</BODY>
</HTML>

--------------------

<html>
<head>
<SCRIPT type="text/javascript">
function rand()
{
now=new Date()
num=(now.getSeconds())%5
alert("Ваше случайное число: " + num)
}
</script>
</head>
<body>
<h1>Случайные числа</h1>
<form>
<input type="button" value="Вывод случайного числа между 0 и 4"
onClick="rand()">
</form>
</body>
</html>

 

Пример 8. Условный оператор и диалог с пользователем

<HTML>
<HEAD>
<SCRIPT type="text/javascript">
function askuser()
{
var answer=" "
var statement="Отвечайте да или нет"
var answer=prompt("Вы любите спорт?")
if ( answer == "да")
{statement="Я тоже люблю спорт!"}
if(answer == "нет")
{statement="Я тоже ненавижу спорт!"}
alert(statement)
}
</SCRIPT>
</HEAD>
<BODY>
<h1>Деятельность</h1>
<FORM action="">
<INPUT TYPE="button" VALUE="Нажми здесь!"
onClick="askuser()">
</FORM>
</BODY>
</HTML>

 

Пример 8. Условный оператор и смена фона в зависимости от ответа

<html>
<head>
<SCRIPT type="text/javascript">
function askuser()
{
answer=prompt("Вы мужчина (М) или женщина (Ж)?")
if ( answer == "Ж")
{document.bgColor="pink"}
if(answer == "М")
{document.bgColor="lightblue"}
}
</script></head>
<body bgcolor="lightyellow">
<h1>Привет</h1>
<form>
<input type="button"
value="Укажите свой пол"
onClick="askuser()">
</form>
</body>
</html>

 

Первая часть (Объявление переменной, Диалоговые элементы, Атрибуты, которые определены для HTML тэгов, Использование кавычек в строковых литералах, Массивы, Коллекции в объектной модели документа, Свойства объекта location, Параметры метода window.open, window.close, Виды кнопок, Таблица умножения, Динамическое изменение содержимого тегов, Выбор цвета текста, Определяется, какая кнопка мыши нажата, Часы в строке статуса, Точное время загрузки страницы, Распечатка - кубы, не превышающие 5000, Возведение в квадрат, Форма prompt, Примеры открытия нового окна, Часы в поле формы, События BODY, Изменение переменной открытого окна, Изменение поля статуса в открытом окне, Цвет и расположение фреймов, Изменение полей формы, Скрытая отправка данных пользователя на сервер, Очистка формы, Проверка пустой строки в отправленной форме, Удаление и добавление вариантов из SELECT, Обработчик onChange при выборе множественных вариантов)
Вторая часть (Распечатка всех ссылок на странице, Простейшее динамическое меню, Простейшая динамическая смена изображений, Простейшие динамические создания новых страниц, Простейшее изменение цвета фона, Подтверждение действия, Бесконечный цикл изменения изображений, Ограниченный цикл изменения изображений, Запуск и остановка мультипликации (смены изображений), Защита переноса на следующую строку (<PRE>), Пункт меню с меняющимся изображением, Простейшее выпадающее меню с изображениями, Управление cookie, Простейший сценарий, Дата, Вывод точной даты и время посещения страницы, Обработчики событий для ссылки, Синтаксис onClick, onFocus, onBlur, onChange, onSubmit, Простейшая форма взаимодействия с пользователем)
Третья часть (Окно с сообщением и полем ввода (prompt), Свойства объекта "navigator" (браузер), Свойства объекта "document", Свойства объекта "history", Два свойства объекта "location" (адрес), Иерархия объектов, Адрес страницы, с которой пришел пользователь, Дата при загрузке страницы, Диалог при загрузке страницы, События при перемещении указателя мыши и уход со страницы, Новое окно, Конфигурация нового окна)

Пятая часть (Простейшее слайд-шоу, Переход на случайный сайт с кнопкой, Цикл угадываний с диалоговым окном и случайным числом, Цикл - распечатка слова определенное количество раз, которое устанавливает пользователь в ходе диалога, Цикл - распечатка слова определенное количество раз, Цикл-счет от одного до 50000 + изменение фона, Цикл-распечатка цифр от одного до пяти, Случайное изображение, Случайная фраза, Угадывание числа до 10)

Для сайтов находящихся на тарифном обслуживании и администрировании работы проводятся без дополнительной оплаты, входят в стоимость тарифа

По всем вопросам обращаться по адресу: Этот адрес электронной почты защищён от спам-ботов. У вас должен быть включен JavaScript для просмотра. или по телефону (WhatsApp): +7-994-009-32-20

Поделиться страницей в социальных сетях:

 

 

Просмотров: 576