Скрипт даты на сайт

Главная | Веб-дизайн и оптимизация сайтов | Фотолаборатория | Радиотехника | Полезные программы | Разработка сайтов Ваш браузер не поддерживает технологию iframes. Для навигации используйте верхнее меню

Дата на сайте

Cоздание скрипта даты и вставка его на HTML-страницу

В предыдущих статьях было рассмотрено создание формы обратной связи и проверка её заполнения посетителем сайта. Еще одна полезная для сайтов вещь – вставка текущей даты. Примеров скриптов даты можно найти в интернете десятки, однако многие из них, на мой взгляд, тяжеловесны и, следовательно, некрасивы. Между тем, используя стандартные средства JavaScript, вставить дату на страницу сайта можно очень просто.

Вот весь скрипт даты:

По-моему, проще некуда, достаточно красиво и понятно. Если у вас нет никакого желания изучать построение этого скрипта, то просто вставляйте его в любое место HTML-страницы и получите следующую надпись: .

Естественно, вы можете оформлять шрифт выводимой надписи обычными средствами HTML. В данном случае использован жирный красный шрифт.

Описанный способ удобен, например, для автоматического ежегодного изменения строки Copyright © 2008 – на сайте, если, конечно, такая строчка там присутствует.

Кстати, вывод текущей даты в тексте частенько используется недобросовестными сайтостроителями в подписях под новостями или статьями: вы видите сегодняшнее число, хотя новость уже давно состарилась.

Теперь для любознательных, а также любящих смотреть в корень, разберём составляющие нашего скрипта вывода даты. Это полезно не только для чувства глубокого внутреннего удовлетворения, но и позволит вам задавать необходимую форму вывода даты.

Объект Date возвращает, то есть считывает с компьютера, информацию о текущей дате. Хотя значения даты возвращаются в стандартной форме, фактическое значение хранится как количество миллисекунд, прошедших после полуночи 1 января 1970 года. Применение этого соглашения запрещает использование дат до 1970 года. (Всегда удивляюсь, как изощрённо программисты умудряются запудрить мозги нормальному человеку. Вспомните страшилки, которыми нас пугали при переходе к новому 2000 году!)

Итак, начинаем с присвоения значения даты переменной d, затем создаём массивы (Array) для дней недели (day) и месяцев (month), указывая их в необходимой грамматической форме: падеж, число, заглавная буква, если слово стоит в начале даты и т.п. Последняя строчка скрипта – собственно печать даты (document.write). Здесь вы устанавливаете, что и в какой последовательности будете выводить в строке текущей даты. Компоненты отделяются друг от друга знаком +. Для ввода пробела используется конструкция " ", а для ввода буквы г (год) – конструкция " г."

Читайте также:  Сколько трафика уходит на фильм

Как видно из скрипта, получение данных о текущем времени выполняет элемент get. Этот метод позволяет получить следующую информацию:

  • getDate() – возвращает число от 1 до 31, представляющее число месяца;
  • getDay() – возвращает день недели как целое число от 0 (воскресенье) до 6 (суббота);
  • getMonth() – возвращает номер месяца в году;
  • getFullYear() – возвращает год. Если использовать просто getYear(), то будет выводиться текущий год минус 1900;
  • get Hours() – возвращает час суток;
  • getMinutes() – возвращает минуты как число от 0 до 59;
  • getSeconds() – возвращает число секунд от 0 до 59.

Вставлять непосредственно Java-скрипт внутрь страницы сайта не всегда удобно. Лучше поместить описание скрипта в начало страницы между тегами и задать переменную, которую будем вызывать по мере необходимости в тексте. Назовём её TODAY и определим в ней форму вывода даты аналогично вышеизложенному. Скрипт будет выглядеть следующим образом:

Для вывода даты вызываем скрипт в нужном месте HTML-кода страницы, используя следующую команду:

Если ваш сайт содержит много страниц, на которых надо показывать дату, то удобнее выделить Java-скрипт вывода даты в отдельный файл, например, data.js. Практически, это страница, состоящая из первого из описанных скриптов, то есть со строкой document.write (см. выше). Располагать её надо в том же каталоге, что и основная страница, и вызывать в месте вывода даты следующим образом:
.

Не забудьте проверить, чтобы файл data.js имел ту же кодировку, что и основной документ, иначе дата будет выводиться замечательными крючками, квадратиками и прочими финтифлюшками. Если вы используете программу Adobe Dreamweaver, то для этого надо выбрать раздел Редактировать – Установки. – Создать документ – Java Script – Кодировка по умолчанию. Также сменить кодировку скрипта можно в Microsoft Word. Для этого откройте документ, задайте нужную кодировку, если он выводится неверно (как это сделать, смотрите в "Справке Word"), а затем сохраните его следующим путем: Файл – Сохранить как – Обычный текст – Сохранить. В открывшемся окне вы можете задать необходимую кодировку.

Замечание. Следует иметь ввиду, что описанный скрипт выводит дату, установленную на компьютере пользователя, что не всегда соответствует реальному текущему времени. Если вам необходимо показать точное время, то необходимо использовать РНР-скрипт, который будет показывать время на сервере. Об этом способе вывода даты на сайте, а также о добавлении даты в письма с формы обратной связи расмотрим в следующей статье.

И последнее – для особо ленивых. Если описанный способ вставки даты покажется вам сложным, то, как говорилось в начале статьи, вы можете воспользоваться готовыми формами, предлагаемыми в интернете, например, информерами Яндекса. Для их размещения на сайте выбираете нужный раздел (пробки, время, погода или новости), понравившийся дизайн информера, задаете город и получаете код для вставки. Два вида таких информеров даты показаны на примере внизу:

Читайте также:  Приложения для отслежки телефона по номеру

Информация, представленная на этой странице ориентирована в первую очередь для начинающих web-мастеров.

В этом уроке рассмотрим вопрос встраивания информации о текущем системном времени и дате в дизайн сайта. Это одна из полезных и практичных вещей, которая создается с помощью скрипта. Приведу пример варианта, который использую на своём сайте.

Именно этот вариант мне показался лучшим, так как выводит в виде простого текста и время и дату одновременно, в отличие от других похожих скриптов, формирующих раздельный вывод – либо даты, либо времени.

Данный скрипт выводит простую и понятную информацию о текущем моменте, он небольшой по объёму, поэтому вполне соответствует принципу разумной достаточности.

Реализация на странице сайта

Создайте новый текстовой документ и дайте ему название, например, date.js . Скопируйте код скрипта из таблицы и вставьте в документ date.js :

Файл date.js закачайте на сервер сайта в папку со скриптами, обычно она так и называется – js .

В месте вывода показа времени и даты расположите этот код:

Путь к файлу скрипта.

В месте вставки последнего кода будет отражаться показ системного времени и даты.

Если у Вас сайт на PHP, вопрос решается гораздо проще. Вот простой пример кода для вывода даты и времени:

Выше представленный код копируйте и вставляйте на страницу сайта на PHP в то место, где планируете вывод даты и времени. Результат выглядит так:

Сегодня 27.12.19. Текущее время 02:28

Капля полезной информации

Чтобы в подвале сайта на PHP в строке Copyright, например, © 2010–2019 site.ru всегда был актуальным текущий год, вместо набора цифр 2019 вставьте следующий код:

и в дальнейшем навсегда избавите себя от ручной корректировки.

Читайте также:  Светодиодные лампы работающие от воды

Вот вся информация по этой теме. Применяйте скрипт на своём сайте и всего Вам самого доброго! Ваш Л.М.

Для того, чтобы посетители и пользователи Вашего сайта могли наблюдать текущую дату и время, воспользуйтесь нашим простым JavaScript кодом, приведенным чуть ниже. Для этого необходимо сначала на JavaScript описать в начале Вашей странички функцию генерирования текущего времени и даты clock() следующим образом:

script type = "text/javascript" >
function clock () <
var d = new Date ();
var month_num = d . getMonth ()
var day = d . getDate ();
var hours = d . getHours ();
var minutes = d . getMinutes ();
var seconds = d . getSeconds ();

month =new Array( "января" , "февраля" , "марта" , "апреля" , "мая" , "июня" ,
"июля" , "августа" , "сентября" , "октября" , "ноября" , "декабря" );

if ( day 9 ) day = "0" + day ;
if ( hours 9 ) hours = "0" + hours ;
if ( minutes 9 ) minutes = "0" + minutes ;
if ( seconds 9 ) seconds = "0" + seconds ;

date_time = "Сегодня – " + day + " " + month [ month_num ] + " " + d . getFullYear () +
" г. Текущее время – " + hours + ":" + minutes + ":" + seconds ;
if ( document . layers ) <
document . layers . doc_time . document . write ( date_time );
document . layers . doc_time . document . close ();
>
else document . getElementById ( "doc_time" ). innerHTML = date_time ;
setTimeout ( "clock()" , 1000 );
>

Далее в заданном месте Вашей странички (там, где будет выводиться дата и время) необходимо добавить следующий HTML код:

После этого необходимо запустить нашу функцию генерации и отображения текущей даты и времени следующим образом:

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

Если Вам необходимо показывать статичное время (время, когда была сгенерирована странички), то рекомендуем Вам воспользоваться скриптом попроще, приведенным в теме Простой PHP скрипт, отображающий текущую дату и время.

Leave a Reply

Ваш адрес email не будет опубликован. Обязательные поля помечены *

You may use these HTML tags and attributes:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>