Отправляет email-рассылки с помощью сервиса Sendsay
  Все выпуски  

Web-программирование - это просто!


Новое на сайте Программирование - это просто! (www.easyprog.ru):

В бесплатном разделе

Добрый день, уважаемые подписчики!

Тема сегодняшнего выпуска: «Java Script: Программа 'Часы'».

 

До сих пор мы изучали разные тонкости языка JavaScript, но так и не начали программировать. Поэтому сегодня мы "состряпаем" пусть для начала и маленькую, но программку. И так, рассмотрим пример:

<HTML>
<HEAD>
<TITLE>Урок 28. Java script: Программа "Часы"</TITLE>
</HEAD>

<SCRIPT Language="JavaScript" type="text/javascript">
function format2(ANumber)
{
if(ANumber<=9) return "0"+ANumber; else return ""+ANumber;
}


function clock_start()
{
var Digital=new Date();
var hours=Digital.getHours();
var minutes=Digital.getMinutes();
var seconds=Digital.getSeconds();
my_div=document.getElementById("clock");
my_div.innerHTML=""+format2(hours)+"."+format2(minutes)+"."+format2(seconds);
setTimeout("clock_start()",1000);
}


</SCRIPT>

<BODY OnLoad="clock_start()">
<div id="clock">
</BODY>
</HTML>

 

Данная программа покажет нам простые электронные часы:

 

 

А теперь разберем ее более подробно.

Функция format2:

 

function format2(ANumber)
{
if(ANumber<=9) return "0"+ANumber; else return ""+ANumber;
}

 

добавляет нуль впереди числа из одной цифры.  Это нужно что бы если у нас время, например 19 часов и 9 минут, то не писало 19.9, а писало 19.09.

 

Затем у нас идет обработчик часов:

function clock_start()
{
var Digital=new Date();
var hours=Digital.getHours();
var minutes=Digital.getMinutes();
var seconds=Digital.getSeconds();
my_div=document.getElementById("clock");
my_div.innerHTML=""+format2(hours)+"."+format2(minutes)+"."+format2(seconds);
setTimeout("clock_start()",1000);
}

 

Он создает объект типа Date, извлекает из него текущее время и записывает в тэг <div>, который находит по ID при помощи метода getElementById. Сам тэг у нас имеет Id "clock":

<BODY OnLoad="clock_start()">
<div id="clock">
</BODY>

 

Про тэг <div>  вы уже знаете из уроков, посвященных языкам HTML и CSS.

Наконец, команда setTimeout("clock_start()",1000) у нас заново запускает подпрограмму "clock_start()" через 1000 миллисекунд (1 секунду). Таки образом, мы обеспечиваем ежесекундное обновление показания часов.

 

С уважением, Шуравин Александр, e-mail: megabax@rambler.ru, автор оставляет за собой право публиковать в рассылках ваши письма, если в письме прямо неоговорено нежелание его публиковать.

 


В избранное