Примеры скриптов

В этом разделы приведены примеры реализации нескольких сценариев: анимация в строке-заголовке, кнопка с подсветкой, итерационные циклы.

Анимация в строке-заголовке браузера

Ниже приведен код программы, предназначенной для формирования движущегося текста в строке-заголовке браузера. Выводимый текст должен располагаться в контейнере title.

script

var tit = document.title;

// Переменной tit присвоено содержимое контейнера title (текст заголовка)

var с = 0;

function writetitle()

// Для функции определено имя writetitle

{

document.title = tit.substring(O,c);

// смена заголовка на переменную tit (количество выводимых символов = с)

if(c==tit. length)

// Проверка равенства переменной с числу символов в заголовке

с = 0;

setTimeout("writetitle()", 2000)

// Пауза до очередного вывода текста составляет 2000 миллисекунд = 2 секунды

}

else

с++;

setTimeout("writetitle()", 100)

// Пауза до вывода очередной буквы текста установлена 100 миллисекунд

}

}

writetitle()

И Вызов созданной функции

/script

Кнопка с подсветкой

Язык JavaScript создавать разнообразные эффекты. Например, необычные кнопки управления.

Особенностью этой кнопки является то, что она изменяет свой цвет при наведении на нее курсора, а также изменяет форму при щелчке.

Рассмотрим, как происходит обработка событий и вызов необходимой Web-страницы. Код обработки событий приведен ниже.

<а href="../../../book/java/jаva_b.htm" onMouseOver="imgOn(,imgr)" onMouseOut="imgOff('img 1')" onMouseDown="imgClick('imgl')" onMouseUp="imgOn('img 1 ')">

В первой строчке вышеприведенного кода указан путь к вызываемой странице (java_b.htm).

Благодаря второй строке кода наведение пользователем курсора на изображение кнопки (событие onMouseOver) вызывает функцию с именем imgOn. За счет этого вместо изображения butl.gif появляется изображение but2.gif. Это дает иллюзию возникновения свечения кнопки. Третья строка отслеживает момент отвода курсора с изображения кнопки (событие оп-MouseOut). В результате такого движения курсора произойдет вызов функции imgOff, и на странице будет сформировано исходное изображение кнопки (butl.gif). Задачей строки onMouseDown="imgClick('imgr)" является определение момента нажатия на кнопку и формирование изображения нажатой кнопки (but3.gif). Запись onMouseUp-'imgOnfimgr)" фиксирует момент отпускания нажатой кнопки. Реакцией на это событие является восстановление начального изображения кнопки.

В последней строке находится тег, который формирует начальное изображение кнопки указанных размеров:

Наибольшее внимание следует обратить на атрибут name="imgl". Рисунку присвоено имя, которое используется при работе скрипта.

Описание используемых функций приведено ниже.

if (document.images){

imglon=new Image();

imglon.src="but2.gif';

imgloff=new Image();

img 1 off. src-'but 1. gif';

imglclick=new Image();

imgl click, src- 'but3.gif';

}

function imgOn(imgName){

if (document.images) {

document[imgName].src=eval(imgName+"on.src");

}

}

function imgOff(imgName) {

if (document.images){

document[imgName].src=eval(imgName+"off.src");

}

}

function imgClick(imgName){

if (document.images) {

document. imgname=imgN ame

document[imgName].src=eval(imgName+"click.src");

}

}

//->

/script

Первая строчка содержит открывающий тег скрипта и атрибут 1ап-guage="JavaScript", который указывает на используемый язык. Заметим, что данный атрибут можно исключить из кода программы, так как по умолчанию предполагается использование языка JavaScript.

11.11.3. Реализация итерационных циклов

Рассмотрим порядок разработки программы для вычисления иррационального числа л. Расчетная формула выглядит так:

ЯГ = (-1)”

4 ?$2и+1

Для наглядности запишем несколько членов этого знакочередующегося ряда и каждый член ряда обозначим символами а,:

  • 71 л I 1 1 I (-1)”
  • — = 1--+---+ --... + -—— + ...=
  • 4 3 5 7 9 2ц + 1

а0 + + а3 + а4 + а5 + ... + ап + ...

Чтобы получить компактную программу, выведем рекуррентную формулу, которая позволяет рассчитать последующий член ряда по известному предыдущему члену ряда. На основании предшествующей формулы запишем п + 7-й член ряда:

(-1)"+1 _ (-1)”+1 а+1 -2 (и + 1) + 1 ” 2л + 3

Возьмем отношение п + 7-го члена ряда к я-му члену ряда:

Д„+1 =(-1)”+1 * (2ц + 1)_ 2ц+ 1

4 ап (2ц + 3) •(-!)" 2ц+ 3

Теперь с помощью полученного коэффициента q любой последующий член ряда может быть выражен через предыдущий член ряда:

ап+ =an-q.

Блок-схема алгоритма для вычисления константы л приведена на рисунке.

На рисунке приняты такие обозначения:

pogr— абсолютная погрешность, с которой вычисляется число л; sum — результат (сумма, накопленная при вычислении); а — значение очередного члена ряда; п — число членов ряда; q — коэффициент.

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

Завершается программа выводом рассчитанного значения числа л.

Код программы на языке JavaScript приведен ниже.

<Ш1е>Итерационный цикл для вычисления числа пи<Лй1е>

script language-'JavaScript"

function Fiter() {

var pogr=0.0000001;

var a=l;

var n=0;

var summ=a;

while (Math.abs(a)>pogr) q=-(2*n+1 )/(2*п+3);

a=a*q;

summ=summ+a; //Тело цикла

п=п+1;

а1ег!("Число пи примерно равно " + 4*summ);

}

/script

В результате действия скрипта па экране появится командная кнопка.

Вычислить

Помещение курсора на командную кнопку «Вычислить» приведет к появлению информационного окна с результатом расчета числа пи (приблизительное значение).

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

 
Посмотреть оригинал
< Пред   СОДЕРЖАНИЕ ОРИГИНАЛ   След >