После прохождения теоретической части пришло письмо об окончании теоретической части курса, будет ли практическая часть? |
Запросы пользователю и переменные
Концепция
В этом уроке рассматриваются две концепции. Одна из них используется, когда необходимо запросить у пользователя информацию. Вторая — создание переменных — будет постоянно применяться при работе с JavaScript.
Кстати, мы возвращаемся к созданию полноценных сценариев JavaScript, а не просто будем добавлять к HTML события, поэтому снова будет использоваться полный формат <SCRIPT type="text/javascript">... </SCRIPT>. Вот что мы собираемся сделать: Мы просим пользователя ввести имя, и с этим именем будет связана переменная. Когда переменная будет присвоена, мы сможем ввести ее в строку document.write, которая выведет имя пользователя на странице.
Этот урок немного длиннее, так как он включает краткий обзор того, что было изучено до сих пор.
Сценарий
<SCRIPT type="text/javascript"> /* Этот сценарий предназначен для получения информации от пользователя и вывода ее на странице */ var user_name = prompt ("Введите свое имя в поле ниже","Здесь"); document.write("Привет, " + user_name + "! Добро пожаловать на мою страницу!"); </SCRIPT>
Текст в скобках должен располагаться на одной строке.
Результат работы сценария
Привет, OL! Добро пожаловать на мою страницу!
Разбор сценария
Что такое /* */?
Эти символы применяются для создания комментариев внутри сценария. В одном из предыдущих уроков мы узнали, что можно использовать двойную косую черту // для создания строки комментария. Двойную косую черту необходимо ставить в начале каждой новой строки комментария. Эти же команды позволяют создавать многострочные комментарии. Нужно поставить /* в начале, а */ в конце, и все, что окажется между этими знаками будет комментарием.
Создание переменной
Переменные имеют первостепенное значение в 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("Текст окна","Текст в поле ввода")
Можно видеть, что var и присваиваемое имя переменной включены в формат. Иначе получился бы запрос, но ничего нельзя было сделать с данными, которые вводит пользователь.
На всякий случай ...
- Чтобы строка ввода оставалась пустой, ничего не пишите между второй парой кавычек.
- Если не указать в скобках второй пары кавычек, в строке ввода появится слово "undefined".
- Если в строке ввода что-то написано и пользователь выберет ОК, ничего не меняя, то в качестве вывода на странице появится то, что написано в строке ввода.
- Если в строке ввода ничего нет и пользователь выберет OK, ничего не вводя, то на странице появится слово null.