СОЗДАНИЕ «ЭЛЕКТРОННЫХ ЧАСОВ» СРЕДСТВАМИ JAVASCRIPT - Студенческий научный форум

VI Международная студенческая научная конференция Студенческий научный форум - 2014

Личный портфель

СОЗДАНИЕ «ЭЛЕКТРОННЫХ ЧАСОВ» СРЕДСТВАМИ JAVASCRIPT

Казаков И.А. 1
1НТГСПА
 Комментарии
Текст работы размещён без изображений и формул.
Полная версия работы доступна во вкладке "Файлы работы" в формате PDF

В настоящее время язык программирования JavaScript широко используется в web-дизайне. Во многих приложениях приходится отображать дату и время, подсчитывать количество дней, оставшихся до заданной даты, и т. п. В основе всех операций, связанных с датами и временем, лежат текущие системные дата и время, установленные на вашем компьютере.

Объект даты создается с помощью выражения вида:

имяОбъектаДаты = new Date([параметры])

Для иллюстрации применения объекта даты в языке JavaScript для web-дизайна приведем следующий пример.

Постановка задачи: создать на странице динамические часы, значение которых будет обновляться ежесекундно. Формат часов возьмем самый обычный hh:mm:ss (например, 16:05:45), где h - время суток, m - минуты, s - секунды.

1.     Оформление дизайна

С помощью любого графического редактора создайте шаблон часов (без циферблата). Например:

 

2.     Создайте html-страницу. Вставьте (лучше с помощью таблицы) полученный рисунок. Используйте код ниже:

<html>

<head>

<title>Пример отображения динамических часов</title>

</head>

<body>

<center>

<table cellpadding=0 cellspacing=0 border=1  height="350px" width="510px">

<tr>

<td background="имя изображения с часами"> <center> <span id="tick_tack"> </center> </span></td>

</tr>

</table>

</body>

</html>

3.     Чтобы отобразить текущее время используйте следующий скрипт:

<script language="JavaScript">

function time()

{

if (!document.all&&!document.getElementById) return

thelement=document.getElementById? document.getElementById("tick_tack"): document.all.tick_tack

var Digital=new Date()

var hours=Digital.getHours()

var minutes=Digital.getMinutes()

var seconds=Digital.getSeconds()

var dn="PM"

if (minutes<=9) minutes="0"+minutes

if (seconds<=9) seconds="0"+seconds

var ctime=hours+":"+minutes+":"+seconds

thelement.innerHTML="<b style='font-size:36;color:black'>"+ctime+"</b>"

setTimeout("time()",1000)}

window.onload=time

</script>

4.     При необходимости отредактируйте положение выведенного времени. Для этого поменяйте значения свойств height и width в теге <table>

 

СПИСОК ЛИТЕРАТУРЫ

1.     Дунаев, В. Самоучитель JavaScript. - Спб.: Питер, 2005, - 395 с.  

 

Просмотров работы: 895