Урок 3
Дата и время

красным цветом даны примечания переводчика
Концепция__Скрипт__Эффект__Разбор скрипта__Задание

Оглавление (в новом окне)

Концепция

Из Урока 1 вам известно, что существует такой объект как документ. Иначе в нем ничего нельзя было бы написать. Сегодня мы поговорим о семи методах объекта: getDay(), getDate(), getMonth(), getYear(), getHour(), getMinute(), и getSecond() (получитьДень, Число, Месяц, Год, Час, Минуту, Секунду). Все они уже существуют, их можно взять и поместить на страницу. Проблема в том, что это всего лишь методы. Для воздействия им нужен объект, а документ для этих целей не годится... так что придется самим придумывать новый объект.

Ошибка 2000!

С 1 января 2000 вместо двух последних цифр года, как раньше, getYear в Експлорере показывает полный четырехзначный номер, а в Нескейпе — число 100. Может быть, Нетскейп заделает эту дырку, а до тех пор лучше пользоваться командой getFullYear, которую, кажется, правильно воспринимает и тот, и другой. Правда, Опера ее вообще не воспринимает.

Скрипт

<SCRIPT LANGUAGE="JavaScript">

//Скрипт отмечает точную дату и время вашего прибытия на страницу

Now = new Date();
document.write("Сегодня " + Now.getDate()+
"-" + Now.getMonth() + "-" + Now.getFullYear() + ".
Вы зашли на мою страницу ровно в: " + Now.getHours() +
":" + Now.getMinutes() + " и " + Now.getSeconds() +
" секунд.")

</SCRIPT>

Кстати, строка document.write не должна прерываться. Я разбил ее на несколько, чтобы удобнее было читать.

 

Эффект

.

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

Не пугайтесь сразу, скоро все станет понятно. Позвольте, уж я снова напомню вам о четкой форме скрипта. Строка 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, но это не так. Вы изучаете незнакомый язык и обязаны подчиняться его правилам.
Команда говорит: Now — это объект, который представляет new Date() (новую Дату). Дата обязательно должна быть новой. Таким способом вы будете получать новую дату каждый раз, когда заходите на страницу или обновляете ее.

Обратите внимание и на точку с запятой в конце. Она указывает на то, что строка JavaScript закончена. Без нее браузер решил бы, что команда продолжается на следующей строке. Ошибка.

Ура! У нас есть объект, на который может воздействовать метод getMonth(). Нам нужно напечатать месяц на странице, значит, где-то должна быть команда document.write(). Нам также известно, что текст в скобках будет виден на странице, так давайте напишем все это, следуя логике:

  • Сначала пишем <SCRIPT LANGUAGE="javascript">.
  • Потом вставляем комментарий о том, для чего предназначен скрипт.
  • Прежде чем приступить к getMonth(), необходимо создать объект. Убедитесь, что строка заканчивается точкой с запятой.
  • Теперь можно вставлять утверждение document.write.
  • Текст в скобках после document.write оформляем по правилам Урока 1.
    • Текст, видимый на странице, должен быть окружен двойными кавычками (одинарные кавычки для кода HTML внутри двойных).
    • Новое правило: сочетание текста и команд требует знака «плюс» + между элементами.
    • Объект и метод разделены точкой, так что команда напечатать месяц выглядит так: Now.getMonth().
    • Новое правило: Now.getMonth() — это не текст, который должен быть виден на странице, а команда, которая указывает месяц. Поэтому не нужно ставить ее ни в какие кавычки.
  • Заканчиваем командой </SCRIPT>.

И вот что у нас получилось:

<SCRIPT LANGUAGE="javascript">

//Скрипт напечатает на странице номер месяца

Now = new Date();
document.write("Сейчас месяц " + Now.getMonth())

</SCRIPT>

Посмотрите на первый скрипт еще раз. Длинная строка уже не кажется такой страшной. Это просто объект Now и метод getЧто-либо() после него. Я разделил элементы даты дефисами. Помните, дефис должен быть виден на странице, поэтому его следует ставить в кавычки. Все части связаны между собой плюсами +.

Пробелы

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

"Сейчас ровно   "

Видите, я добавил пробел перед второй кавычкой? Когда скрипт отпечатается на странице, пробел окажeтся на своем месте. Помните: это не HTML. В Javascript существуют свои правила относительно пробелов.

Длинная строка

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

document.write("Сегодня " + Now.getDate() +
"-" + Now.getMonth() + "-" + Now.getFullYear() + ".
Вы зашли на страницу ровно в: " + Now.getHours() +
":" + Now.getMinutes() + " и " + Now.getSeconds() +
" секунд.")

  1. Я начал с «Сегодня », прибавив пробел в конце.
  2. Следом знак плюс.
  3. Now.getDate() без кавычек, потому что нам нужен не текст, а цифры.
  4. Еще плюс.
  5. Потом дефис в кавычках, чтобы отделить следующие цифры. Никаких пробелов, потому что они должны стоять вплотную.
  6. Плюс.
  7. Потом Now.getMonth без кавычек, чтобы у нас был месяц.
  8. Плюс.
  9. Еще дефис в кавычках, чтобы он был виден на странице.
  10. Плюс.
  11. Еще один метод Now.getFullYear сообщит год.

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

Кое-что об одной из самых интересных заморочек JavaScript. Должно быть, вы заметили, что номер месяца на один меньше, чем нужно. Почему? Цифры сообщает нам JavaScript, a JavaScript любит считать от нуля. Чудно, ничего не скажешь, но так уж вышло. Tо есть, январь нулевой месяц и так далее.

Так что же делать? Прибавить 1, разумеется! Тут требуется известная сноровка. Нужно ввести несколько переменных, то есть, присвоить имя некоему элементу (это еще будет в Уроке 6). Вы присваиваете new Date() имя, как уже делали раньше. Затем присваиваете имя команде, которая вызывает месяц. Ниже я назвал ее mpo (Mесяц Плюс Oдин). И прибавляете к ней единицу. Эту новую команду я назвал mpo1. На слух довольно путано, но не торопитесь. Вот как это выглядит:

<SCRIPT LANGUAGE="javascript">

Now = new Date();
var mpo = Now.getMonth();
var mpo1 = mpo + 1
document.write("Сейчас месяц " + mpo1 + ".");

</SCRIPT>

И вот что у вас получилось:

Это уж правильный месяц, или как?

Ваше задание

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

Возможный ответ здесь

Концепция__Скрипт__Эффект__Разбор скрипта__Задание

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

авторы Джо Бернс и Эндри Грауни. Оригинал и многое другое на английском языке © EarthWeb Inc.
Перевод, оформление и верстка © Татьяна.

Hosted by uCoz