Получить текущее время в js_Как динамически отображать дату и время в js
Получить текущее время в js_Как динамически отображать дату и время в js

Всем привет, мы снова встретились, я ваш друг Цюаньчжаньцзюнь.

js может получить текущую дату и время через объект Date, использовать Date(), чтобы получить текущее системное время, использовать getFullYear(), getMonth(), getDate(), getHours() и другие методы, чтобы получить время в определенном формат и используйте метод InnerHTM для его отображения.

Во-первых, давайте взглянем на некоторые методы, необходимые js для получения текущего времени:

Получить текущее время:

Язык кода:javascript
копировать
var d = new Date();//Получаем текущее системное время

Получите время в определенном формате:

1. Получить текущий год

Метод getYear(): вы можете получить год (2 или 4 цифры), а возвращаемое значение — это поле года, представляющее текущий объект Date.

Примечание. Если год находится между 1900 и 1999, метод getYear() возвращает значение, состоящее только из двух цифр; если год до 1900 или после 1999, он может возвращать 4-значное значение. пример:

Язык кода:javascript
копировать
var d = new Date();

console.log(d.getYear());

 

var born = new Date("1983");

console.log(born.getYear());

Примечание. Метод getYear() не может получить полный год, а начиная с ECMAScript v3 он был заменен методом getFullYear() и больше не используется.

Метод getFullYear(): вы можете получить текущий полный год (4 цифры, 1970-???). пример:

Язык кода:javascript
копировать
var d = new Date();

console.log(d.getFullYear());

 

var born = new Date("1983");

console.log(born.getFullYear());

2. Получить текущий месяц

getMonth(): вы можете получить месяц по местному времени.

Примечание. Значение, возвращаемое методом getMonth(), представляет собой целое число, начинающееся с 0 (обозначающее январь) и заканчивающееся цифрой 11 (обозначающее декабрь), то есть целое число от 0 до 11, если вы хотите получить то же время, что и время; текущее время. Для месяца вы можете добавить 1 после значения, возвращаемого методом getMonth(). пример:

Язык кода:javascript
копировать
var d=new Date();

console.log(d.getMonth());

console.log(d.getMonth()+1);

3. Получить текущее количество дней

getDate(): может возвращать определенный день месяца, используя местное время; возвращаемое значение — целое число от 1 до 31. пример

Язык кода:javascript
копировать
var d = new Date();

console.log(d.getDate())

 

var d = new Date(“July 21, 1983”);

console.log(d.getDate())

4. Получить текущее время

getHours(): Получает количество часов. Возвращаемое значение часа представляет собой целое число от 0 до 23.

getMinutes(): Получает минуты. Возвращаемое значение минут представляет собой целое число от 0 до 59.

getSeconds(): Получает количество секунд. Возвращаемое значение секунд представляет собой целое число от 0 до 59.

Пример: Получить текущее время

Язык кода:javascript
копировать
var d = new Date();

var hour= d.getHours();//Получаем количество часов

var minute= d.getMinutes();//Получаем минуты

var second= d.getSeconds();//Получаем количество секунд

js получает текущее время и отображает пример:

HTML+CSS-код

Язык кода:javascript
копировать
<style type="text/css">
.time span{
	display: inline-block;
	width: 40px;
	height: 20px;
}	
</style>
<div class="time">текущее время:<br /><br />
	<span id="y"></span_id>Год
	<span id="mo"></span_id>луна
	<span id="d"></span_id>день
	<span id="h"></span_id>час
	<span id="m"></span_id>точка
	<span id="s"></span_id>Второй
	<span id="time">1</span_id>//вызовshow()函數
</div>

js-код:

Язык кода:javascript
копировать
function show(){

var now = new Date();

var year = now.getFullYear(); //Получаем год

var month = now.getMonth()+1;//Получаем месяц

var date = now.getDate();//Получаем дату

// var day = now.getDay();//Получить день недели

var hour= now.getHours();//Получаем количество часов

var minute= now.getMinutes();//Получаем минуты

var second= now.getSeconds();//получено секунд

 

 

document.getElementById("y").innerHTML=year;

 

document.getElementById("mo").innerHTML=month;

 

document.getElementById("s").innerHTML=date;

document.getElementById("h").innerHTML=hour;

 

document.getElementById("m").innerHTML=minute;

 

document.getElementById("s").innerHTML=second;

setTimeout(show,1000);//Таймер всегда вызывает функцию show()

return "";

}

Второй тип: используйте JS для отображения системного времени в реальном времени. 参考:https://blog.csdn.net/qq_36190858/article/details/86152204?utm_medium=distribute.pc_relevant.none-task-blog-baidujs_title-4&spm=1001.2101.3001.4242 Код выглядит следующим образом:

Язык кода:javascript
копировать
<!DOCTYPE html>
<html lang="en">

	<head>
		<meta charset="UTF-8">
		<title>JSвремя</title>
		<style>

		</style>
	</head>

	<body>
		<div id="time"></div>
		<script type="text/javascript">
			function time() {
				var vWeek, vWeek_s, vDay;
				vWeek = ["Воскресенье", "Понедельник", "Вторник", "Среда", "Четверг", "Пятница", "Суббота"];
				var date =  new Date();
				year = date.getFullYear();
				month = date.getMonth() + 1;
				day = date.getDate();
				hours = date.getHours();
				minutes = date.getMinutes();
				seconds = date.getSeconds();
				vWeek_s = date.getDay();
				document.getElementById("time").innerHTML = year + "Год" + month + "луна" + day + "день" + "\t" + hours + ":" + minutes + ":" + seconds + "\t" + vWeek[vWeek_s];

			};
			setInterval("time()", 1000);
		</script>
	</body>

</html>

Визуализации следующие:

Издатель: Лидер стека программистов полного стека, укажите источник для перепечатки: https://javaforall.cn/193228.html Исходная ссылка: https://javaforall.cn

boy illustration
Учебное пособие по Jetpack Compose для начинающих, базовые элементы управления и макет
boy illustration
Код js веб-страницы, фон частицы, код спецэффектов
boy illustration
【новый! Суперподробное】Полное руководство по свойствам компонентов Figma.
boy illustration
🎉Обязательно к прочтению новичкам: полное руководство по написанию мини-программ WeChat с использованием программного обеспечения Cursor.
boy illustration
[Забавный проект Docker] VoceChat — еще одно приложение для мгновенного чата (IM)! Может быть встроен в любую веб-страницу!
boy illustration
Как реализовать переход по странице в HTML (html переходит на указанную страницу)
boy illustration
Как решить проблему зависания и низкой скорости при установке зависимостей с помощью npm. Существуют ли доступные источники npm, которые могут решить эту проблему?
boy illustration
Серия From Zero to Fun: Uni-App WeChat Payment Practice WeChat авторизует вход в систему и украшает страницу заказа, создает интерфейс заказа и инициирует запрос заказа
boy illustration
Серия uni-app: uni.navigateЧтобы передать скачок значения
boy illustration
Апплет WeChat настраивает верхнюю панель навигации и адаптируется к различным моделям.
boy illustration
JS-время конвертации
boy illustration
Обеспечьте бесперебойную работу ChromeDriver 125: советы по решению проблемы chromedriver.exe не найдены
boy illustration
Поле комментария, щелчок мышью, специальные эффекты, js-код
boy illustration
Объект массива перемещения объекта JS
boy illustration
Как открыть разрешение на позиционирование апплета WeChat_Как использовать WeChat для определения местонахождения друзей
boy illustration
Я даю вам два набора из 18 простых в использовании фонов холста Power BI, так что вам больше не придется возиться с цветами!
boy illustration
Получить текущее время в js_Как динамически отображать дату и время в js
boy illustration
Вам необходимо изучить сочетания клавиш vsCode для форматирования и организации кода, чтобы вам больше не приходилось настраивать формат вручную.
boy illustration
У ChatGPT большое обновление. Всего за 45 минут пресс-конференция показывает, что OpenAI сделал еще один шаг вперед.
boy illustration
Copilot облачной разработки — упрощение разработки
boy illustration
Микросборка xChatGPT с низким кодом, создание апплета чат-бота с искусственным интеллектом за пять шагов
boy illustration
CUDA Out of Memory: идеальное решение проблемы нехватки памяти CUDA
boy illustration
Анализ кластеризации отдельных ячеек, который должен освоить каждый&MarkerгенетическийВизуализация
boy illustration
vLLM: мощный инструмент для ускорения вывода ИИ
boy illustration
CodeGeeX: мощный инструмент генерации кода искусственного интеллекта, который можно использовать бесплатно в дополнение к второму пилоту.
boy illustration
Машинное обучение Реальный бой LightGBM + настройка параметров случайного поиска: точность 96,67%
boy illustration
Бесшовная интеграция, мгновенный интеллект [1]: платформа больших моделей Dify-LLM, интеграция без кодирования и встраивание в сторонние системы, более 42 тысяч звезд, чтобы стать свидетелями эксклюзивных интеллектуальных решений.
boy illustration
LM Studio для создания локальных больших моделей
boy illustration
Как определить количество слоев и нейронов скрытых слоев нейронной сети?
boy illustration
[Отслеживание целей] Подробное объяснение ByteTrack и детали кода