Методические рекомендации к выполнению задания 3

Дата добавления: 2015-06-12; просмотров: 535; Нарушение авторских прав

1 Создайте документ, создающий на экране изображение работающих часов:

Начало формы

<html>

<head>

<!-- hide

var timeStr, dateStr;

function clock() {

now= new Date();

// время

hours= now.getHours();

minutes= now.getMinutes();

seconds= now.getSeconds();

timeStr= "" + hours;

timeStr+= ((minutes < 10) ? ":0" : ":") + minutes;

timeStr+= ((seconds < 10) ? ":0" : ":") + seconds;

document.clock.time.value = timeStr;

// дата

date= now.getDate();

month= now.getMonth()+1;

year= now.getYear();

dateStr= "" + month;

dateStr+= ((date < 10) ? "/0" : "/") + date;

dateStr+= "/" + year;

document.clock.date.value = dateStr;

Timer= setTimeout("clock()",1000);}

// -->

</script>

</head>

Время:

Дата:

</form>

</body>

</html>

2 Просмотрите результат.

Примерный вид результата:

Время:

Дата:

Конец формы

Здесь для ежесекундной коррекции времени и даты используется метод setTimeout(). Фактически это сводится к кому, что каждую секунду создается новый объект Date, в который заносится текущее время.

Можно видеть, что функции clock() вызываются программой обработки события onLoad, помещенной в тэг <body>. В разделе body HTML-страницы имеется два элемента формы для ввода текста. Функция clock() записывает в оба эти элемента в корректном формате текущие время и дату. Для этой цели используются две строки timeStr и dateStr. Существует проблема с индикацией, когда количество минут меньше 10 - в данном скрипте эта проблема решается с помощью следующей строки: timeStr+= ((minutes < 10) ? ":0" : ":") + minutes;

Как видим, количество минут заносится в строку timeStr. Если у нас менее 10 минут, то мы еще должны приписать спереди 0. Эта строка в скрипте может показаться немного странной, и ее можно было бы переписать в более знакомом Вам виде:

if (minutes < 10) timeStr+= ":0" + minutes

else timeStr+= ":" + minutes;

<== предыдущая лекция	\|	следующая лекция ==>
Методические рекомендации к выполнению задания 1	\|	Методические рекомендации к выполнению задания 4