📆 Скрипт поточної дати для сайту JavaScript і PHP✭

5/52 ratings

Привіт друзі, багато користувачів мені неодноразово задають питання "як додати дату на сторінку сайту?", Та дуже просто, і сьогодні я вам це доведу, а щоб питань на цю тему залишилося якомога менше то ми тут детально і з прикладами вивчимо кілька методів виведення дати на сторінки сайту.

У мережі дуже багато різних варіантів виведення поточної дати на свій сайт, погодьтеся адже дата і час на сайті це одне з найбільш корисних речей на будь-якому веб ресурсі без яких не обходиться практично не один нормальний сайт, ми звичайно ж не будемо вивчати всі варіанти вставки дати на HTML-сторінку, а розглянемо тільки найосновніші і які я сам використовую в своїх проектах.

І так сьогодні ми з вами розглянемо скрипт дати за допомогою JavaScript, а також навчимося показувати поточну дату на сайті з використанням простого коду php, який з варіантів і створення скрипта дати використовувати вирішувати звичайно ж тільки вам, тобто скрипт поточної дати для свого сайту ви вибираєте той який вас більше влаштує.

Ну що ж давайте приступимо і ви переконаєтеся в тому що вставити дату на сторінку сайту дуже легко, особливо коли є приклади створення скрипта дати. І так першим пунктом ми розберемо кілька варіантів дата на сайті з використанням простих стандартних методів JavaScript.

1.Перший варіант відображення дати на сайті з використанням JavaScript:

<script language="javascript" type="text/javascript"><!--
var d = new Date();

var day=new Array("Неділя","Понеділок","Вівторок",
"Середа","Четверг","Пятниця","Субота");

var month=new Array("січня","лютого","березня","квітня","травня","червня",
"липня","серпня","вересня","жовтня","листопада","грудня");

document.write(day[d.getDay()]+" " +d.getDate()+ " " + month[d.getMonth()]
+ " " + d.getFullYear() + " р.");
//--></script>

var d = new Date();

var day=new Array("Неділя","Понеділок","Вівторок",

"Середа","Четверг","Пятниця","Субота");

var month=new Array("січня","лютого","березня","квітня","травня","червня",

"липня","серпня","вересня","жовтня","листопада","грудня");

document.write(day[d.getDay()]+" " +d.getDate()+ " " + month[d.getMonth()]

+ " " + d.getFullYear() + " р.");

//--></script>

Це самий простий спосіб додати дату на сайт, просто вставте даний код дати в потрібне місце на вашому сайті.
Нижче приклад як він буде виглядати на сайті.

2. Добре, тепер давайте розглянемо другий варіант виведення дати на сайті з використанням JavaScript тільки умову задамо трохи складнішу:

<script type="text/javascript">// <![CDATA[
 day = new Date(); hour = day.getHours(); if (hour>=5 && hour<12) greeting = "Добрий ранок"; else { if (hour>=12 && hour<18) greeting = "Добрий день"; else { if (hour>=18 && hour<24) greeting = "Добрий вечір"; else { if (hour>=0 && hour<5) greeting = "Доброї ночі"; } } } document.write(greeting);
// ]]>
// ]]>
// ]]>
// ]]>
// ]]>
// ]]></script>
!  Сегодня
<script type="text/javascript">// <![CDATA[
// <![CDATA[
var d = new Date();

var day=new Array("Неділя","Понеділок","Вівторок",
"Середа","Четверг","Пятниця","Субота");

var month=new Array("січня","лютого","березня","квітня","травня","червня",
"липня","серпня","вересня","жовтня","листопада","грудня");

document.write(day[d.getDay()]+" " +d.getDate()+ " " + month[d.getMonth()]
+ " " + d.getFullYear() + " г.");
// ]]>
// ]]>
// ]]>
// ]]>
// ]]>
// ]]></script>

day = new Date(); hour = day.getHours(); if (hour>=5 && hour<12) greeting = "Добрий ранок"; else { if (hour>=12 && hour<18) greeting = "Добрий день"; else { if (hour>=18 && hour<24) greeting = "Добрий вечір"; else { if (hour>=0 && hour<5) greeting = "Доброї ночі"; } } } document.write(greeting);

// ]]>

// ]]></script>

! Сегодня

// <![CDATA[

var d = new Date();

var day=new Array("Неділя","Понеділок","Вівторок",

"Середа","Четверг","Пятниця","Субота");

var month=new Array("січня","лютого","березня","квітня","травня","червня",

"липня","серпня","вересня","жовтня","листопада","грудня");

document.write(day[d.getDay()]+" " +d.getDate()+ " " + month[d.getMonth()]

+ " " + d.getFullYear() + " г.");

// ]]>

// ]]></script>

Ну а приклад відображення ви можете наочно побачити нижче:

! Сьогодні

Точно так само як і в першому варіанті щоб додати дату на свій сайт просто вставте код в потрібне місце сторінки. Ну і я думаю не зайвим буде даний приклад коду трохи розібрати, вивчити так сказати.

Ну що ж, давайте почнемо зі змінною значення дати 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.

Ну ось власне і все, тепер ви знаєте як додати дату на свій сайт використовуючи простий код javascript.

3. Але ми не зупиняємося, і перейдемо до наступного нашого пункту, Дата і час на PHP. Зараз ми розглянемо найпростіший код PHP за допомогою якого і будемо виводити дату на сайті.

Отже щоб отримати дату в php на свій сайт використовуємо наступний код:

<?php
// Дата по-русски
function getDateRus(){
    $monthes = array(
        1 => 'Січня', 2 => 'Лютого', 3 => 'Березня', 4 => 'Квітня',
        5 => 'Травня', 6 => 'Червня', 7 => 'Липня', 8 => 'Серпня',
        9 => 'Вересня', 10 => 'Жовтня', 11 => 'Листопада', 12 => 'Грудня'
    );
    return ( (int)date('d') . ' ' . $monthes[(date('n'))] . date(' Y'));
}

// День недели по-русски
function getDayRus(){
    $days = array(
        'Неділя', 'Понеділок', 'Вівторок', 'Середа',
        'Четверг', 'Пятниця', 'Субота'
    );
    return $days[(date('w'))];
}

echo "Добрий день!";
echo " ";
echo "Сьогодні";
echo " ";
echo getDayRus();
echo " ";
echo getDateRus();
echo " ";
echo "рік.";
echo "<br>";
date_default_timezone_set("Europe/Kiev");
echo "Київський час " . date("G:i"); 
?>

<?php

// Дата по-русски

function getDateRus(){

$monthes = array(

1 => 'Січня', 2 => 'Лютого', 3 => 'Березня', 4 => 'Квітня',

5 => 'Травня', 6 => 'Червня', 7 => 'Липня', 8 => 'Серпня',

9 => 'Вересня', 10 => 'Жовтня', 11 => 'Листопада', 12 => 'Грудня'

);

return ( (int)date('d') . ' ' . $monthes[(date('n'))] . date(' Y'));

}

// День недели по-русски

function getDayRus(){

$days = array(

'Неділя', 'Понеділок', 'Вівторок', 'Середа',

'Четверг', 'Пятниця', 'Субота'

);

return $days[(date('w'))];

}

echo "Добрий день!";

echo " ";

echo "Сьогодні";

echo " ";

echo getDayRus();

echo " ";

echo getDateRus();

echo " ";

echo "рік.";

echo "<br>";

date_default_timezone_set("Europe/Kiev");

echo "Київський час " . date("G:i");

Ну і його вигляд буде таким:

І ще невеликий бонус, додамо живий годинник на сайт який буде відраховувати час в режимі реального часу для цього додаємо на сайт відразу перед закриваючим тегом head код:

<script type="text/javascript">
function startTime()
{
var tm=new Date();
var h=tm.getHours();
var m=tm.getMinutes();
var s=tm.getSeconds();
m=checkTime(m);
s=checkTime(s);
document.getElementById('timer').innerHTML=h+":"+m+":"+s;
t=setTimeout('startTime()',500);
}
function checkTime(i)
{
if (i < 10)
{
i="0" + i;
}
return i;
}
</script>

function startTime()

{

var tm=new Date();

var h=tm.getHours();

var m=tm.getMinutes();

var s=tm.getSeconds();

m=checkTime(m);

s=checkTime(s);

document.getElementById('timer').innerHTML=h+":"+m+":"+s;

t=setTimeout('startTime()',500);

}

function checkTime(i)

{

if (i < 10)

{

i="0" + i;

}

return i;

}

</script>

і в потрібне бажане місце сайту додамо сам годинник:

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

</body>

А ось так все це буде виглядати:

Ну ось тепер сміливо можу ставити крапку, тепер ви знаєте як додавати і показувати дату і час на своєму сайті.
Користуйтеся на здоровя.

Як показати поточну дату на сайті?

⏰ Отримання і відображення дати і часу | Приклад як ✅ вставити дату на сторінку сайту.

КОРИСНА РЕКЛАМА НА САЙТІ

Немає коментарів

Залишити відповідь Скасувати відповідь

Анімоване SVG модальне вікно

Як показати поточну дату на сайті?

Стильний відео фон для сайту

Прості вкладки для сайту на CSS3

Просте спливаюче вікно для сайту

КОРИСНА РЕКЛАМА НА САЙТІ

Вас також може зацікавити

Немає коментарів

Залишити відповідь Скасувати відповідь