Часы на javascript. На самом деле все просто!
Как-то я очень искал самые простые часы на javascript. Но поскольку, в те далекие времена и не подозревал, что существуют вообще какие-то языки. То просто поставил, что нашел.
И когда сегодня мы уже имеем некоторое представление о программировании, то в момент, когда потребовались часы на javascript, то нам просто нужно их написать!
Погнали!
Мы сегодня разбирали вывод времени в javascript. И некоторые элементы мы почерпнем из этой страницы.
Начнем с логики и что нам требуется собственно сделать! Нам нужен какой-то код, который будет получать время, ну, например, через секунду, выводить его на экран, стирать старое значение и перезаписывать новое и так до бесконечности!
На php это сделать нельзя, вернее можно конечно, но вам придется через секунду перезагружать страницу. А на javascript это сделать легко и не нужно перезагружать страницу.
Нам потребуется функция setInterval – которая выполняет код много раз, через равные промежутки времени.
Поставим интервал в одну секунду(1сек = 1000)
Ну и далее создадим свою функцию, в которой зададим объект
Установим требуемые деления для времени – часы/минуты/секунды
Отправим все полученное в наш див под ид равным display
Выше скрипта поставим
Теперь соберем все вместе:
<div id="display"></div>
<script>
setInterval(myFuncSuper, 1000);
function myFuncSuper() {
var data = new Date();
var time = data.getHours() + ":" + data.getMinutes() + ":" + data.getSeconds();
document.getElementById('display').innerHTML = time;
}
</script>
Результат:
Обратите внимание, что если у вас какой-то из трех элементов будет меньше 10, то у него отсутствует ноль!
Это не совсем привычно и когда смотришь на это время, то кажется. Что чего-то не хватает…
Что нужно сделать, чтобы к нашей цифре у которой отсутствует ноль, его прибавить!?
Для этого для каждого метода нам нужно ввести новую переменную их будет три - часы, минуты, секунды: «Chasi, Minutes, Seconds»
И сделаем 3 условия, если у нас одна из трех переменных будет меньше 10, то прибавим к ней нолик...
И между двоеточием поставим пробел, а то, время у нас прилепилось друг к другу...
Результат:
Друзья! Если здесь нет часов. То попробуйте перезагрузить страницу –пока не нашли в чем проблема…
Скрипт № 28.2. Проверка нажат ли checkbox
Скрипт № 28.3. Видимость элемента JS
Скрипт № 28.4. Изменить картинку при нажатии JS
Все скрипты на одной странице
Поддержка граватар