Запрос пользователю и переменные

Концепция

В этом уроке у меня две концепции. Одна только для тех случаев, когда вы решите запросить у пользователя информацию. Вторая, создание переменных, останется с вами на всю вашу жизнь в JavaScript.
Между прочим, научившись добавлять события к HTML, мы возвращаемся к полным скриптам, поэтому нам снова понадобится стандартный формат от <Script Language="JavaScript"> дo </SCRIPT>. Вот что мы собираемся сделать: мы спросим у пользователя, как его зовут, и присвоим этому имени переменную. Как только переменная будет присвоена, мы сможем ввести ее в строку document.write, которая напечатает это имя на странице.

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

Скрипт

<Script Language="JavaScript">
/* Скрипт предназначен для того, чтобы получить
от пользователя информацию и поместить ее на страницу */

var user_name = prompt ("Напишите свое имя","Здесь");
document.write("Привет, " + user_name + "! Милости просим!");
</SCRIPT>

Текст в скобках должен располагаться на одной строке.

Эффект

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

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

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

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

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

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

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

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

var (от variable, переменная) объявляет, что следующим словом будет имя переменной. user_name (имя пользователя) — имя переменной. Я его придумал. Оно необязательно должно быть таким длинным. По правде, я мог бы назвать ее N, если б захотел. Просто удобнее так называть переменные, чтобы легко было вспомнить, о чем идет речь. Помните, что регистр имеет значение для JavaScript, следовательно, если вы назвали переменную Dog, то буква D каждый раз должна быть заглавной, иначе браузер посчитает их за два разных слова. Здесь нет никаких кавычек, просто ставьте одно слово за другим, как показано выше. Знак равенства = указывает на то, что переменная будет равна результату следующей команды. В нашем случае переменная будет представлять результат, полученный с помощью окна запроса.

Команда Prompt

В данном примере я воспользовался новой командой prompt (запрос). Это метод, вызывающий окно, которое вы видели, заходя на страницу. Если хотите снова его увидеть, перезагрузите страницу. Вот формат запроса:

var variable_name = prompt("Текст в окне","Текст в строке ввода")

Вы увидите, что имя переменной включенo в схему скрипта, иначе вы получили бы запрос, но полученные им данные никуда бы не пошли.

Если вам интересно...

Чтобы строка ввода оставалась чистой, ничего не пишите между второй парой кавычек. Если вы не укажете в скобках второй пары кавычек, в строке появится слово undefined. Если вы написали что-либо в строке ввода и пользователь выберет ОК, ничего не меняя, на странице появится то, что вы написали. Если в строке ввода ничего нет и пользователь выберет OK, ничего не вписав, на странице появится слово null.

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

Теперь, когда вы знаете все составляющие, перейдем к основной части:

var user_name = prompt ("Напишите свое имя","Здесь");
document.write("Привет, " + user_name + "! Милости просим!");

Имя переменной user_name присвоено результату запроса. prompt просит пользователя написать свое имя. В строке ввода читаем: "Здесь." Точка с запятой в конце строки. document.write вызывает текст "Привет, ". Знак плюс + отмечает, что все элементы идут друг за другом. user_name вводит результат запроса. Никаких кавычек — эти слова не нужны нам на странице. Еще плюс. "! Милости просим!" завершает текст. Точка с запятой.

Пожалуйста, постарайтесь хорошенько понять концепцию переменных. В этом языке они используются постоянно. Без них не обойтись.

Ваше задание

...повтор пройденного.

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

Здесь пример JavaScript

Вперед, на Урок 7

Copyright © 2002-2006 Максим Комогоров. Все права защищены.
Замечания, вопросы и предложения направляйте
по адресу: webscript@pisem.net
Поиск по сайту
О проекте
Архив
Hosted by uCoz