Разбор скрипта

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

Что это за штука // ?

По ходу наших разговоров вы будете узнавать все больше новых команд. Это одна из них. Двойная дробь указывает на комментарий внутри скрипта. Она означает, что следующий за ней текст не участвует в процессе. Можете добавлять сколько угодно текста, только помните, что каждая строка должна начинаться с двойной дроби //.

Методы Дата и Время

Посмотрите на скрипт. Видите, скрипту дается команда поместить в документ число, месяц, год, часы, минуты и секунды. Несколько дополнительных слов объясняют, на что вы смотрите.

Все это было создано с помощью метода getЧто-либо(). Обратите внимание на заглавную букву. Сначала «g» в нижнем регистре, потом Заглавная буква.

Во-первых, помните, что все это цифры. Даже метод getDay(), который отвечает за день недели, выражается цифрой от единицы до семи.

Начнем с месяца. Как уже говорилось раньше, getMonth() — это метод, отвечающий за месяц. Теперь задумаемся о том, на какой объект воздействует метод getMonth(). Помните это из Урока 1? Метод (method) воздейcтвует на объект (object).

Может показаться, что getЧто-либо() — это метод объекта document. Вовсе нет. Метод документа — write. getMonth() на самом деле является методом объекта Date. Взгляните на скрипт еще раз. Date занимает отдельное место в команде:

Now = new Date();

Я устанавливаю объект, с которым будет работать метод getMonth(). Имея дело с датой и временем, всякий раз пользуйтесь той же схемой. Нужно создать объект. Мой объект называется Now (сейчас). Видите? Между прочим, я мог бы назвать его Zork или Fred, браузеру все равно. Это не имеет значения, если объект получил оригинальное имя, которое больше нигде в JavaScript не встречается.

Если вам кажется, что кое-что тут поставлено с ног на голову, я вас понимаю. Такое впечатление, что следует писать new Date = Now, но это не так. Вы изучаете незнакомый язык и обязаны подчиняться его правилам.

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

Во-первых, onMouseOver (обратите внимание на заглавные буквы) представляет собой обработчик событий (Event Handler) гипертекстовой ссылки. Это понятно? Он используется внутри гиперссылки.

Формат ссылки остается без изменений. Те же команды и те же двойные кавычки. onMouseOver ставится сразу же после адреса URL. Видите?

Событие (Event) приводится в действие, когда браузер распознает onMouseOver="". Схема уже должна казаться вам немного знакомой: два элемента, разделенных точкой. До сих пор это означало, что один является объектом, а другой методом. Но не в этом случае. Объектом является window (окно), оно существует; status (статус) представляет собой property (свойство) oкна. Это небольшой участок окна, где должен разместиться следующий текст. Это проще запомнить, если представить, что метод обычно выражается глаголом, как write (писать) или get (получить). Свойство выражается существительным и существует как небольшая часть элемента, стоящего перед точкой.

Если у window есть изменяемое свойство status, значит, можно изменить и другие свойства окна. Это верно, но не будем лезть поперед батьки в пекло. Займемся пока окном и его строкой состояния.

После window.status следует знак равенства = и то, что должно произойти. В данном случае это текст в одинарных кавычках. Он появится в строке состояния, когда вы наведете курсор на ссылку.

Пожалуйста, обратите внимание на точку с запятой в конце строки.

return true Эти два слова имеют не последнее значение. Они дают скрипту указание проверить, есть ли строка состояния. Если отчет (return) соответствует действительности (true), тогда происходит событие. Обратите внимание, что текст в строке состояния уже не изменяется и не изменится, сколько раз вы не наводили бы на нее курсор.

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

Стоп! Что это такое /* */?

Да, я вставил еще одну новую команду. Эти штуки означают комментарий внутри скрипта. Если помните, урока три назад я уже показывал вам двойную дробь //, отделяющую текст вашего комментария от скрипта. Это то же самое, но лучше. Двойную дробь необходимо ставить в начале каждой новой строки. Эти же команды годятся для пространных комментариев. Нужно поставить /* в начале и */ в конце, и все, что окажется между этими знаками, останется комментарием и не войдет в скрипт.

Создание переменной

Переменные имеют первостепенное значение в JavaScript. Вам необходимо научиться создавать их. В двух словах: вы назначаете имя, состоящее из одного слова, функции JavaScript. Помните, как мы помещали дату на страницу с помощью метода getDate()? В строке document.write мы написали метод getDate() целиком. Сделать это один раз было не так уж трудно. Но что если нужно было бы написать это десять раз на одной и той же странице? Писать и писать одно и то же порядком надоедает.

Потому мы и вводим переменную, которая должна представлять окончательный результат метода. Возьмем, к примеру, переменную d. Тогда нам нужно будет только однажды написать getDate() и назначить методу переменную d. И на протяжении всего оставшегося скрипта будем просто писать d там, где нужно поставить дату. Это понятно? Вернемся к примеру:

Вот строка из скрипта, которая назначает переменную:

var user_name = prompt ("Напишите свое имя","Здесь")

Переменная была создана по следующей схеме:

· var (от variable, переменная) объявляет, что следующим словом будет имя переменной.

· user_name (имя пользователя) — имя переменной. Я его придумал. Оно необязательно должно быть таким длинным. По правде, я мог бы назвать ее N, если б захотел. Просто удобнее так называть переменные, чтобы легко было вспомнить, о чем идет речь.

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

Поговорим о каждой группе отдельно...

Почему местами шрифт жирный?

Да так, ради забавы. Найдите в скрипте элементы, которые написаны жирным шрифтом. Я просто добавил команды <B> и </B> по обеим сторонам от имени переменной. Раз это document.write, в текст можно вписать любые команды HTML, изменяющие текст. Только следите за тем, чтобы команды HTML находились внутри двойных кавычек, иначе браузер посчитает их частью скрипта — это было бы ошибкой.

Вернемся к нашим свойствам...

Свойства объекта navigator

var an = navigator.appName;

var av = navigator.appVersion;

var acn = navigator.appCodeName;

var ua = navigator.userAgent;

document.write("Вы пользуетесь <B>" +an+ "</B>,

версия " +av+ ".<BR>Кодовое название " +acn+ ",

заголовок " +ua+ "." );

</SCRIPT>

Люди обожают эти штуки. Объект navigator имеет четыре свойства. Обратите внимание на заглавные буквы!

appName сообщает название браузера, например, Netscape или Explorer.

appVersion сообщает версию браузера и платформу, на которой он работает.

appCodeName сообщает кодовое имя, данное браузеру, например, Netscape называет свой браузер Mozilla.

userAgent сообщает заголовок протокола, используемого браузером во время работы с серверами.

Иногда важно знать версию браузера. Чуть позже мы изучим команды If (если). Зная браузер пользователя, можно дать команду: "Если браузер такой-то, сделать то-то."

Свойства объекта document

var bgc = document.bgColor;

var fgc = document.fgColor;

var lc = document.linkColor;

var al = document.alinkColor;

var vlc = document.vlinkColor;

var url = document.location;

var ref = document.referrer;

var t = document.title;

var lm = document.lastModified;

document.write("Цвет фона этой страницы <B>"

+bgc+ "</B>.")

document.write("<BR>Цвет текста этой страницы <B>" +fgc+ "</B>.")

Что это  за штуки такие?

Еще одна команда. Возможно, она кажется вам знакомой. Этими знаками вы пользуетесь для комментариев в теле HTML:

Я привел их здесь, так как, хотите верьте, хотите нет, в мире все еще существуют браузеры, не понимающие JavaScript. Если браузер не читает JavaScript, он воспринимает его как текст, который нужно напечатать на странице. Выглядит это ужасно. Но если пользоваться этими командами, тогда браузер успешно проигнорирует незнакомый текст и покажет страницу.

Однако соблюдайте несколько правил:

· Команды комментария должны находиться между <SCRIPT> и </SCRIPT>. Если вы поставите их снаружи, то браузер посчитает комментарием весь скрипт и ничего не выйдет.

· Текст после команды <!-- должен находиться на одной строке.

· Перед заключительной командой --> должна стоять двойная дробь //, иначе JavaScript примет ее за часть скрипта. Ошибка.

· Нет, совсем не обязательно писать текст к этим командам. Я вставил его, чтобы вам проще было понять их назначение.

· Пользуйтесь приведенной выше схемой, и у вас не будет проблем.

Вернемся к разбору

Сначала первая часть скрипта устанавливает функцию. Потом команда в строке <BODY> ее запускает. Давайте сначала разберем функцию.

function dateinbar()

{

var d = new Date();

var y = d.getFullYear();

var da = d.getDate();

var m = d.getMonth() + 1;

Эффекты с мышью, как вы уже догадались, создаются с помощью команд onMouseOver и onMouseOut. Обратите внимание, что между ними ощутимая разница. Вам не нужно, чтобы эти события происходили одновременно. Помните, несколько уроков назад мы разделяли два обработчика событий запятой, чтобы они происходили одновременно? Здесь не тот случай. Следовательно, нужно писать их как две абсолютно разные команды, каждая из которых содержит свою команду return true.

Чтобы получить такой эффект при уходе со страницы, добавляем команду onUnload="alert('Уже уходите?')" в строку BODY. Обратите внимание на двойные и одинарные кавычки. Внутри двойных — одинарные. Вторая пара двойных кавычек означает для браузера конец команды.

Расположение на странице

Начнем с расположения скрипта на странице. До сих пор я говорил, что лучше помещать скрипты повыше, чтобы они первыми загружались в память компьютера и начинали работать без задержки. Когда вы имеете дело с функцией, скрипт помещается между командами <HEAD>. Здесь я хочу сделать вам другое предложение.

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

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

Не стоит злоупотреблять всплывающими окнами. По себе и по другим знаю, как это иногда раздражает. Если же появление нового окна оправдано, то хорошо бы предупредить об этом заранее.

window.open

Нельзя сказать яснее, чем это: window (окно) — объект, a open (открыть) — метод, который на него воздействует.

Конфигурация нового окна

Информация об этом находится в круглых скобках (это называется примером, помните?) Вот схема, которой вы будете следовать:

('URL документа в новом окне', 'Название нового окна', config='параметры нового окна')

Сегодняшний образец:

('opened.html','joe',config='height=300,width=300')

opened.html — это URL страницы, которая появится в новом окне. Если страница располагается на другом сервере, то добавьте http:// и так далее.

joe — название нового окна. Через минуту я объясню вам, для чего оно нужно. config= указывает, что следующие команды относятся к конфигурации нового окна.

Команды конфигурации

Они сообщают, что новое окно будет размером 300 на 300 пикселей.

Кстати, всегда делайте ваше окно немножко больше, чем нужно вам. Может быть, у кого-то другое разрешение экрана, и ваши размеры окна ему не годятся.

Главная часть скрипта, содержащая функцию, помещается между командами <HEAD> и </HEAD>, как большинство функций.

По самой обычной схеме функция получает имя openindex(). Теперь подходим к основному моменту. Создаем переменную OpenWindow, под которой скрывается команда window.open(). Вот так:

var OpenWindow=window.open("", "newwin", "height=300,width=300');

Это было на . Единственная разница в том, что вы не указываете URL. Видите пустые парные кавычки? Они говорят браузеру, что он должен искать информацию о новом окне. То же самое, что и не ставить URL в ссылку, которая закрывает окно. Оно бы не закрылось, если бы начала загружаться новая страница. Точно так же и тут. Браузер стал бы загружать новую страницу, а не выполнять скрипт.

Теперь начинаем писать страницу HTML, которая будет внутри нового окна. Вот первая строка текста:

OpenWindow.document.write("<HTML>")

Переменная OpenWindow (то есть новое окно) говорит, что этот текст должен быть вписан в документ.

Взгляните на скрипт. Каждая новая строка следует той же схеме. Можно написать сотню строк, создающих законченную страницу. Наш скрипт совсем небольшой, так как это наглядное пособие.

Помните: когда вы пишете HTML внутри команды document.write, вместо двойных кавычек с подкомандами ставьте одинарные. Иначе будут проблемы.

Наконец командой onLoad в строке BODY запускается функция.

У вас есть выбор

Во-первых, скрипт говорит:

if (confirm("Вы уверены, что хотите пойти на прошлый урок?") )

Это значит Если (Здесь ваш шанс сделать выбор)

В нашем случае сonfirm предлагает альтернативу: «OK» и «Отмена». Можно сказать, Да и Нет. Обратите внимание на скобки. После команды IF всегда идут скобки, но, как известно, команды сonfirm тоже требует скобок. Следовательно, берем две пары скобок, одна внутри другой.

Сразу же после этого идут команды, выполняемые при каждом варианте ответа. Обратите внимание на фигурные скобки{}. Ведь в действительности это функции. Первая из них показывает, что должно произойти, если пользователь выберет ОК (или Да).

{

parent.location='http://www.jsp.newmail.ru/les12.htm';

alert("Счастливого пути");

}

Если помните, несколько уроков назад я говорил, что parent.location означает ссылку. Дальше идет обыкновенная команда alert. Не забудьте про точки с запятой в конце строк.

А что если я выберу отмену?

Мы уже знаем, что если выбрать ОК, запускается функция IF (если). Отмена — другой выбор. Видите, сразу после фигурной скобки идет команда ELSE (иначе), как бы «если нет». И тогда следующий текст...

else

{

alert("Tогда оставайтесь");

}

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

Все это вместе и дает пользователю возможность выбора: входить или не входить.

Это самые основы использования IF и ELSE. Позже команде IF мы посвятим целый урок. Она того заслуживает, как вам кажется? Аплодисменты команде IF, дамы и господа!

<BODY>

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>

Скрипт устанавливает переменную numsums. Видите, она равна 12 (10+2)? Затем он переводит переменную в alert и показывает, что 10 + 2 = переменная или 12. Ясно?

Другая переменная, х, приравнивается к 10, и alert тоже показывает ее значение.

Следующая переменная, y, равна x, умноженному на 2. Дважды десять — двадцать, не правда ли? Ответ тоже виден в окне alert.

Наконец создается переменная z, которая доказывает, что с помощью знаков исчисления можно соединять текст. И снова метод alert.

Посмотрите еще раз, как работает скрипт.

Переменные начинаются с VAR (от слова variable, переменная), следом идет имя, знак = и значение переменной. VAR можно не писать, но я советую вам не отказываться от него, пока вы не набьете руку.

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

Имена переменных различают регистр! То есть 'Х' и 'х' — это две разные переменные.

Значение текстовой переменной ставится в кавычки. Числовые переменные не ставятся в кавычки, иначе скрипт поймет их как текст с числовым значением 0!

Сложение, вычитание, умножение и деление выражаются знаками: +, -, *, и / соответственно.

Знак плюс (+) выполняет две задачи: складывает числа или печатает вместе два фрагмента текста.

Во всех языках программирования есть зарезервированные слова, например, названия команд. В любой книжке есть их перечень. Этими словами называть переменные нельзя. Например, не надо использовать в качестве переменной, скажем, слово onMouseOver.

Если необходимо, вместо пробела ставьте знак _ user_name.

Вы уже знаете о событиях достаточно, чтобы самостоятельно разобрать скрипт. Когда убираете курсор с картинки, появляется b.gif. Когда наводите на картинку, появляется а.gif.

Обратите внимание, что команда IMG связана с обработчиками onMouse в команде HREF через команду NAME="pic1". Не имеет значения, сколько изображений у вас на странице и в каком порядке они располагаются, если вы присвоили отдельное имя каждой нужной картинке.

onMouseOver и onMouseOut различают регистр. Нельзя менять заглавные и строчные буквы.

Так как необходимо ставить кавычки после onMouseOver= и onMouseOut=, название файла *.gif ставится в одинарные кавычки.

document.pic1.src следует иерархии объектов, о которой мы говорили в . Document относится к объекту документ, a pic1 — это имя объекта изображение (имя можно придумать какое угодно). src (источник) — это свойство объекта изображение, которое указывает файл с картинкой.

В этом примере onMouseOver меняет источник изображения на а.gif.

ОnMouseOut заставляет объект изображение показывать а.gif.

Имейте в виду, что для наилучшего эффекта картинки должны быть одинакового размера.

Не забывайте про регистр и <script language= "javascript">

function up()

{

document.mypic.src="up.gif"

}

function down()

{

document.mypic.src="down.gif"

}

Функции выполняют то же, что и команды на . Помните иерархию объектов? Сначала документ, потом имя, присвоенное объекту и наконец SRC. Функции названы up() и down().

<A HREF="http://www.newmail.ru"

onMouseOver="up()" onMouseOut="down()">

<IMG SRC="down.gif" NAME="mypic"

BORDER=0></A>

Схема практически та же, что и на .

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

Если вы решите использовать многократные смены картинок с помощью JavaScript, помните, что каждый раз нужно давать функции и изображению новое имя. Например: вы хотите поместить на страницу еще один такой же скрипт. Для этого создаем новую функцию, копируя предыдущую и добавляя к ее названию цифру 2. Затем меняем имя рисунка на mypic2. Не забудьте поменять его и в строке img src="*.gif". Получаем следующее:

function up() {

document.mypic.src="up.gif"

}

function down() {

document.mypic.src="down.gif"

}

function up2() {

document.mypic2.src="up.gif"

}

function down2() {

document.mypic2.src="down.gif"

}

</SCRIPT>

...идве разные картинки:

<A HREF="http://www.htmlgoodies.com"

onMouseOver="up()" onMouseOut="down()">

<IMG SRC="down.gif" NAME="mypic"

BORDER=0></A>

<a href="http://www.htmlgoodies.com"

onMouseOver="up2()" onMouseOut="down2()">

<IMG SRC="down.gif" NAME="mypic2"

BORDER=0></A>

Видите, как новые функции связаны с новыми именами? Делайте это каждый раз при добавлении новой картинки.

Вот снова скрипт и форма:

function newcolor(color)

{

alert("Вы выбрали " + color)

document.bgColor=color

}

<FORM>

<INPUT TYPE="button" VALUE="Голубой"

onClick="newcolor('lightblue')">

<INPUT TYPE="button" VALUE="Розовый"

onClick="newcolor('pink')">

<INPUT TYPE="button" VALUE="Вернуть"

onClick="newcolor('white')">

</FORM>

Обратите внимание, мы передаем в функцию newcolor() (новый цвет) неизменяемую строку текста, стоящую в скобках ('lightblue'). Она находится в одинарных кавычках, потому что имя функции стоит в двойных.

Когда вы нажимаете кнопку, строка в скобках передается в функцию newcolor().

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

Форма передает цвет двум элементам в разделе <SCRIPT>: методу alert и строке document.bgColor. Получив все данные, функция вступает в действие: всплывает окно и меняется цвет фона.

Не запутайтесь: VALUE (значение) в команде INPUT не является свойством JavaScript, она помещает текст на кнопку.

От вас снова потребуется четкое понимание иерархии объектов.

Во-первых, создаем функцию с переменной search(искать), которая будет результатом чего-то, происходящего в объекте document, под названием formsearch, внутри элемента find (найти), который обладает свойством value(значение).

Вторую функцию помещаем внутри первой. Видите вторую пару {фигурных скобок}?

Для второй функции создаем еще одну переменную searchUrl, представляющую собой адрес поисковой машины Yahoo плюс значение переменной search, полученное через команду document.formsearch.find.value.

Наконец, location.href приравнивается к переменной searchUrl. После выполнения функции пользователь попадет на итоговую страницу.

Теперь переходим к командам формы. Их две: текстовое поле, куда пользователь вводит свой запрос, и кнопка, запускающая функцию.

Обратите внимание, что форма в целом получила имя formsearch. Помните, что мы говорили об иерархии объектов?

Затем называем текстовое поле find. Опять иерархия. Видите, как мы идем от большого к малому?

Дальше соединяем кнопку с командой onClick, которая запускает функцию.

Наконец заканчиваем командой </FORM>. Готово.

Начнем с элементов формы:

Ваше имя:

Вашафамилия:

</FORM>

Видите, мы дали форме имя myform. Поле ввода для имени пользователя названо fname, а поле для фамилии — lname. Теперь у каждого элемента есть имя.

Данные, которые введет пользователь, станут значением (value) соответствующих текстовых полей. Понятно? Тому, что написано в поле fname, будет присвоено имя fname.

Когда пользователь нажмет на кнопку (обработчик события onClick), запустится функция doit().

Теперь посмотрим на функцию:

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)

}

Такой передачи данных, как на предыдущих уроках, не происходит. Видите, в скобках функции doit() ничего нет. Но по иерархическим командам понятно, что функция вызывает данные, введенные в форму.

Мы тщательно следуем иерархии объектов: за объектом документ следует объект форма (на него указывает имя формы, myform), за ним следует объект поле формы (на него указывает имя поля, fname), за ним следует свойство значение (value). Без свойства value данные, переданные пользователем, не попали бы в иерархическую команду.

Дальше переменная greeting (приветствие). Приветствие показано в команде alert(greeting).

Когда пользователь нажимает на кнопку, всплывает окно с его именем.

Второе окно включает в себя переменную greeting. Появляется надпись: «Привет, (имя) (фамилия)», составленная с помощью данных, полученных через форму. Еще раз обратите внимание на value.

Наконец всплывает третье окно c неким текстом и вызывает следующее: document.myform.fname.value.length. Этo команда, которая передает длину (length) слова, введенного в поле формы. Если fname содержит «Коля», то длина равна 4. Команда length следует за value.Таким образом она точно сосчитает буквы в тексте, а не что-нибудь другое. length — это тоже свойство.

Сегодня начнем с функции:

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>

</form>

Это обыкновенная кнопка и событие через onClick, с которым вы не раз встречались. Все очень просто.

Начнем с кнопки:

<FORM>

</FORM>

Здесь ничего нового, простая форма с кнопкой, которая запускает функцию askuser() (спросить пользователя).

Фрагмент скрипта с функцией:

function askuser() {

var answer=" "

var statement="Отвечай, даилинет"

var answer=prompt("Любишь горчицу?")

if ( answer == "да")

{statement="Ятоже обожаю горчицу!"}

if(answer == "нет")

{statement="Ятоже горчицу терпеть не могу!"}

alert(statement)

}

Значение переменной answer (ответ) равно тому, что введет пользователь по запросу.

На все те случаи, когда пользователь не отвечает «да» или «нет», создается переменная statement (заявление).

Дальше запрос prompt приравнивается к answer. Теперь у нас две переменные под одним именем. Пока имейте это в виду.

Следом за if идет условие в (круглых скобках).

В условии ставим не один, а два знaка равенства ==! Одинарный знак = используется вне скобок.

Помните, отрезки текста ставятся в кавычки.

Вот как разворачивается действие:

Запрашивается ваше мнение;

Скрипт сверяет его с условиями;

Если ответ «да», появляется окно со словами: «Я тоже обожаю горчицу!»

Если ответ «нет», появляется окно со словами: «Я тоже терпеть не могу горчицу!»

Если ответ ни тот, ни другой, тогда переменная answer остается пустой и заявление «Отвечай, да или нет» отсылается в alert.

Помните, что JavaScript чувствителен к регистру. Tо есть если вы напишете «НЕТ» или «Нет», условие не будет выполнено! Чтобы условие было верно, необходимо ввести «нет». Исправить это можно, добавив еще несколько условий IF на все случаи жизни.

Начнем со строки BODY:

На этот раз функция запускается не кнопкой через onClick, а командой onLoad, чтобы к тому времени, когда пользователь нажмет на кнопку, число уже было выбрано. Если сделать это, как в прошлом уроке, то каждый раз, нажимая на кнопку, вы будете получать новое число. А оно должно оставаться одним и тем же, пока вы гадаете.

Первая функция:

function rand() {

now=new Date()

num=(now.getSeconds())%10

num=num+1

}

Функция выбирает наугад число от 0 до 9 и привязывает его к num. Потом прибавляет к num единицу, чтобы выбор осуществлялся между 1 и 10. Мы делали это на прошлом уроке.

Вторая функция:

function guessnum()

{guess=prompt("Угадай, какое?")

if (eval(guess) == num)

{alert("ПРАВИЛЬНО!!!")

rand()

}

else

alert("Нет. Попробуй еще раз.")

}

Этот фрагмент написала Эндри, потому что она очень умная. В памяти компьютера уже есть число, полученное через первую функцию. Вторая дает вам возможность угадать его. Смотрите, что происходит:

С помощью запроса создается переменная guess (догадка).

Функция eval() вычисляет или выполняет строку в скобках (выражение, команду или последовательность команд) и подставлает полученное значение вместо себя. Она не является методом какого-либо объекта, но может использовать свойства уже существующего. В данном случае переводит текст, полученный с помощью запроса, в нашу функцию для последующей обработки.

Обратите внимание на {фигурные скобки}. Все это очень похоже на Урок 21.

Переходим к IF/Else. Если (if) guess (догадка) равна загаданному числу num, тогда запускается команда alert("ПРАВИЛЬНО").

Если это не так, а иначе (else), тогда запускается другая команда alert.

Это вам уже знакомо:

</form>

Кнопка запускает функцию, которая дает возможность угадать задуманное число.

Начнем с цифры:

var0="От пирогов не толстеют"

var1="Кто ходит в гости по утрам"

var2="До пятницы я совершенно свободен"

now=new Date()

num=(now.getSeconds() )%3

document.write("Случайная цифра: "

+ num)

document.write должна располагаться на одной строке!

Это вы можете разобрать и сами, все было на прошлых уроках.

Мы создали три переменные. Это неизменяемые фрагменты текста, и потому заключены в двойные кавычки.

Следующий шаг: программа берет случайную цифру с помощью часов вашего компьютера. %3 указывает на то, что будет выбрана цифра между 0, 1 и 2. На этот раз мы не прибавляем к num единицу, так как нам подходит и 0.

Наконец команда document.write() говорит, что выбранная цифра будет показана на странице.

Теперь взглянем на другой фрагмент скрипта:

if (num == 0)

{cliche=var0}

if (num == 1)

{cliche=var1}

if (num == 2)

{cliche=var2}

document.write(cliche + "<br>") >

Помните, что условия после IF требуют двойного знака равенства ==.

Если условие верно, будет выполнена команда, заключенная в {фигурные скобки}. Возможны только три результата, поэтому мы написали три условия, чтобы одно из них оказалось верным.

Обратите внимание еще раз, что условие заключено в (круглые скобки), а результат в {фигурные}.

Наконец команда document.write(cliche) напишет на странице то изречение, которое было присвоено переменной cliche (см. начало скрипта).

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

for (i=1; i<=5; i=i+1)

{}

</script>

Посмотрим на синтаксис фрагмента for (i=1; i<=5; i=i+1). В нем три части. Все они разделены точкой с запятой.

i=1 устанавливает начальное значение переменной, управляющей циклом. В данном случае это 1, но можно было установить 10 или 100. Это просто точка отсчета.

i<=5 условие, определяющее, сколько в цикле будет повторений. В нашем случае цикл будет повторяться до тех пор, пока i не больше пяти. Видите? Мы начали с одного и досчитаем до пяти.

i=i+1 определяет значение прибавляемой величины. В нашем случае программа будет прибавлять 1 к i. Программа может прибавлять и 2, и 20, и 567.

Наконец команда document.write, печатающая цифры на странице. Обратите внимание на <BR> — так цифры печатаются с новой строки. С таким же успехом можно было написать их в одну строку, разделив запятыми.

Этот JavaScript повторится пять раз, написав на странице цифры от 1 до 5. Мы могли бы заставить его досчитать до миллиона, но ваш браузер завис бы на веки вечные.

loops=3

num=1

while (num <= loops)

{

document.write("Добрый ")

num=num+1

}

document.write("Вечер!")

</SCRIPT>

Еще одна коротенькая программа, мы ее мигом разберем.

Синтаксис у While и For похож. Разница в том, что мы устанавливаем точку отсчета и величину возрастания прямо в команде For. Команда While содержит только условие.

while(num<=loops) говорит программе, что она должна повторять цикл еще и еще раз, пока значение num меньше или равно значению переменной loops. Видите знак <=?

Другими словами, программа повторит цикл трижды, один раз для num=1, один раз для num=2 и еще один раз для num=3.

Каждый раз, когда программа выполняет цикл, она пишет «Добрый» и прибавляет 1 к num. Когда num доходит до 4, цикл заканчивается. 4 не меньше или равно 3, поэтому программа напишет «Добрый» три раза.

Завершающий штрих — команда document.write со словом «Вечер».

Содержание раздела