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

с червен цвят са дадени забележките на преводача
Концепция__Скрипт__Ефект__Разбор на скрипта__Задача

Съдържание (в нов прозорец)

Концепция

Oт Урок 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,за браузера е безразлично. Няма значение какво име ще получи обекта.
Разбирам ви, ако ви се струва че всичко е с краката нагоре. Създава се впечатление че трябва да се пише new Date = Now, но това не е така. Вие изучавате непознат език и сте длъжни да се подчинявате на правилата му.
Командата казва: Now — това е обект, който представлява new Date() (нова Дата). Датата обязателно трябва да бъде нова. Така вие ще получавате нова дата всеки път, когато отваряте страницата или я презареждате.

Обърнете внимание и на точката с запетаята в края. Те показват, че реда JavaScript е завършен. Без тях браузера би решил, че командата продължава на следващия ред. Грешка.

Ура! Имаме обект, на който може да въздейства метода getMonth(). Трябва да напишем на страницата месеца, значи, трябва някъде да има команда document.write(). Също така ни е известно, че текста в скобите ще се вижда на страницата, нека напишем всичко това, следвайки логиката:

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

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

<SCRIPT LANGUAGE="javascript">

//Скрипта пише на страницата месеца

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

</SCRIPT>

Вижте първия скрипт още веднъж. Дългия ред не изглежда вече толкова страшен. Това просто е обект Now и метод getНещо-си() след него. Аз съм разделил елементите на датата с _ дефиси. Помнете, дефиса трябва да се вижда на страницата, затова се слага в кавички. Всички части са свързани с плюсове +.

Разстояние между думите

Ще ви науча на малка хитрост. Колкото и разстояние да оставяте до и след знака плюс, това няма да има видим резултат. Елементите ще са без разстояние помежду си. Затова, ако искате разстояние, добавяйте го при текста в кавички. Например:

"Сега е точно   "

Виждате ли, оставих разстояние преди втората кавичка? Когато скрипта се появи на страницата, разстоянието ще е на местото си. Помнете: това не е HTML. В Javascript съществуват свои правила относно разстоянията.

Дължина на реда

Няма да се спирам подробно, защото мисля че вече сте наясно . Да видим само реда с датата. Ето как изглежда:

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() име, как вече го правихме. После присвоявате име на командата, която извиква месеца. По долу я нарекох mpе (Mесец Плюс Един). И прибавяте към нея единица. Тази нова команда нарекох mpе1. Ето как изглежда:

<SCRIPT LANGUAGE="javascript">

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

</SCRIPT>

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

Това е вече правилния месец!

Вашата задача

Днешната задача не е сложна. Предлагам ви да напишете скрипт който да извика на страницата ви датата разделена с наклонена черта-/. Приветствения текст трябва да е с зелен цвят. Също добавете че вие сте писали скрипта, защото... сте го писали вие!

Възможен отговор тук

Напред към урок 4

автори Джо Бернс и Ендри Грауни. EarthWeb Inc.
Превод и оформление ©
ganevv.