JavaScript, один из наиболее популярных языков программирования. Этот язык программирования имеет большие возможности и инструменты для работы с датой и временем.
В этой статьи мы изучим примеры инструментов для работы с датой и временем в JS, чтобы вы могли легко и эффективно использовать их в своих проектах.
Пример 1: реализуем простой вывод текущей даты и времени.
html:
<p>Текущая дата и время: <span id="dateTime"></span></p>
JavaScript:
<script>
function updateDateTime() {
const dateTime = new Date().toLocaleString(); // получение текущей
даты и времени
document.getElementById("dateTime").textContent = dateTime; //
обновление содержимого элемента
}
// вызов функции updateDateTime каждую секунду
setInterval(updateDateTime, 1000);
</script>
Здесь мы определяем функцию `updateDateTime()`, которая получает текущую дату и время с помощью метода `toLocaleString()` и обновляет содержимое элемента `<span>` с помощью `textContent`. Затем мы вызываем эту функцию каждую секунду с помощью `setInterval()`. Таким образом, содержимое элемента будет обновляться каждую секунду и отображать текущую дату и время.
Результат:
Пример 2: реализуем вывод оставшихся дней и времени до определенного дня
К примеру выберем день - пятница.
html:
<h1>До пятницы осталось:</h1>
<p id="timeLeft"></p>
JavaScript:
<script>
const today = new Date().getDay();
if (today === 5) {
document.getElementById("timeLeft").textContent = "Сегодня пятница!";
} else {
const friday = new Date();
friday.setDate(friday.getDate() + (5 - today) % 7);
const timeLeft = friday - new Date();
document.getElementById("timeLeft").textContent = `До пятницы
осталось ${Math.floor(timeLeft / (1000 * 60 * 60 * 24))} дней и ${new
Date(timeLeft).toLocaleString('ru-RU', { hour: '2-digit', minute: '2-digit' })}
часов`;
}
</script>
В этом коде мы создаем новый объект даты для пятницы и вычисляет разницу между текущей датой и будущей пятницей, а также определяем, является ли текущий день пятницей. Если да, то он выводит текст "Сегодня пятница!". В противном случае он продолжает вычислять количество оставшихся дней до ближайшей пятницы. Вывод количества оставшихся дней и время до пятницы осуществляется с помощью метода toLocaleString().
Результат:
На этом все, спасибо за внимание.
Надеюсь эта статья была для вас полезной и вы останетесь с нами надолго!