Может кто-нибудь объяснить мне эти часы реального времени JavaScript? - PullRequest
Новая
       4

Может кто-нибудь объяснить мне эти часы реального времени JavaScript?

0 голосов
/ 23 декабря 2010 
<html>
<head>
<script type="text/javascript">
function startTime()
{
var today=new Date();
var h=today.getHours();
var m=today.getMinutes();
var s=today.getSeconds();
h=checkTime(h);
m=checkTime(m);
s=checkTime(s);
document.getElementById('txt').innerHTML=h+":"+m+":"+s;
t=setTimeout('startTime()',500);
}

function checkTime(i)
{
if (i<10)
  {
  i="0" + i;
  }
return i;
}
</script>
</head>

<body onload="startTime()">
<div id="txt"></div>
</body>
</html>

Я просто не совсем понимаю эти две строки: 

document.getElementById('txt').innerHTML=h+":"+m+":"+s;
t=setTimeout('startTime()',500);

Может кто-нибудь объяснить это словами?Что делают getElementById ('txt'), innerHTML и setTimeout ('startTime ()', 500)?

Ответы [ 5 ]

5 голосов
/ 23 декабря 2010

См. Документацию .

  • getElementById получает элемент HTML DOM с заданным идентификатором
  • Свойство innerHTML элемента DOM определяет HTML-код элемента

  • Метод setTimeout запускает функцию через указанное количество миллисекунд
    Обратите внимание, что этот код крайне плохая практика; никогда передать строку в setTimeout.
    Должно быть setTimeout(startTime, 500), передавая саму функцию.
    Вы даже можете передать анонимную функцию: 

    setTimeout(function() { alert('Five seconds later...'); }, 5000);
0 голосов
/ 23 декабря 2010

document.getElementById('txt') сообщает браузеру, что вы хотите манипулировать элементом с идентификатором «txt» (в данном случае пустым div).

Часть .innerHTML означает, что вы просто хотите изменитьHTML внутри div с определенным значением, которое указано далее.

setTimeout('startTime()',500) используется для выполнения функции через определенное время.Первый параметр (startTime()) определяет, какую функцию вы хотите выполнить, а второй параметр (500) означает, сколько миллисекунд нужно ждать перед выполнением функции.Когда setTimeout вызывает функцию, в которой она находится, это означает, что страница будет продолжать зацикливать функцию каждые 500 миллисекунд (или любое другое указанное количество миллисекунд)

0 голосов
/ 23 декабря 2010

Каждому элементу HTML может быть присвоен атрибут id, который его уникально определяет.

Код 

document.getElementById('txt')

возвращает ссылку на объект DOM, представляющий некоторый элемент HTML сid txt .

Свойство innerHTML этого объекта представляет HTML-код внутри этого элемента.Если вы присвоите строку этому свойству, эта строка заменит HTML, который был там *

Функция setTimeout устанавливает время ожидания, так что оно выполнит предоставленную функцию после заданного времени ожидания (заданного в миллисекундах)) истек срок действия.

В вашем случае 

 setTimeout('startTime()',500);

выполнит функцию startTime за 500 миллисекунд.

setTimeout возвращает идентифицированное значение, которое вы можете использовать дляотмените ваш запрос позже.

Вы можете найти больше о getElementById и setTimeout в MDN или с небольшим количеством рассудительного поиска в Google (или Binging или Lycosing или любым другим)

0 голосов
/ 23 декабря 2010

Если вы посмотрите на HTML, вы увидите, что есть <div id="txt">. Метод getElementById('txt') делает именно то, на что он похож, он захватывает <div> с идентификатором txt. Свойство innerHTML получит то, что находится внутри <div>, и позволит вам также изменить то, что в нем.

setTimeout() - это метод, который позволяет отложить выполнение определенной функции. Он принимает функцию и время в миллисекундах. В этом случае через 500 миллисекунд будет вызвана функция startTime(). Я предполагаю, что он позволяет загружать все дерево DOM до запуска функции. Я неправильно прочитал код. Вызов setTimeout() используется для рекурсивного вызова startTime(), но вставляет задержку в 500 мс, чтобы браузер не зависал при попытке запустить бесконечный цикл.

0 голосов
/ 23 декабря 2010

Первая строка получает элемент на странице с атрибутом id, равным txt (в данном случае <div>), и устанавливает содержимое (innerHTML) в строку с отформатированным временем.

Вторая строка устанавливает таймер в JavaScript для повторного вызова той же функции через 500 миллисекунд. По сути в следующий раз обновим часы. Примечание это каждые полсекунды. Вероятно, он должен иметь значение 1000.

...