使用html和css向网站添加实时约会

Question

我想这样做，当有人访问网站时，它会以本例的格式显示他们的当前日期：2022年1月15日。我以前尝试过不同的脚本，但它们都以我不喜欢的格式出现。

Answer 1

已经提到了如何将日期集成到标记中。但还没有说的是，你应该考虑这个命令。我会把日期注射后加载。这样一来，我就安全了，只要加载了DOM，我的JS也可以寻址选择器。

window.onload = () => {    
const el = document.getElementById('customDate');  
el.innerHTML = (new Date).toISOString().split("T")[0];  
}

<div id="customDate">waiting...</div>

Answer 2

实现这一点的最佳方法是使用Javascript。Javascript为网站增加了一个新的维度。因此，您要么使用香草Javascript，要么使用Moment.js 等第三方库

在您的情况下，我建议使用香草Javascript，因为您不会过多地处理日期。这里有一个代码片段，可以帮助你完成

function getCurrentDate() {
let date;
let dateTime;

date = new Date;
dateTime = date.toISOString().split("T")[0];
document.querySelector("#display-date").textContent =  dateTime;
}
getCurrentDate();

<h1 id="display-date"></h1>

此外，请记住在body标记的末尾添加一个script标记，以引用Javascript代码。

W3schools:W3schools教程脚本标签

堆栈溢出文章：在JS 中格式化日期

Answer 3

您可以使用Java Script来完成此操作。没有这一点。

const d = new Date();
document.getElementById("date").innerHTML = d;

<h2>Date</h2>
<p id="date"></p>

Answer 4

<!-- Current Date -->
Current Date:
<input type="text" id="currentDate">
<br><br>
<script>
var today = new Date();
var date = today.getFullYear()+'-'+(today.getMonth()+1)+'-'+today.getDate();
document.getElementById("currentDate").value = date;
</script>
<!-- Current Time -->
Current Time:
<input type="text" id="currentTime">
<br><br>
<script>
var today = new Date();
var time = today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds();
document.getElementById("currentTime").value = time;
</script>
<!-- Current Date and Time -->
Get Current Date and Time Both:
<input type="text" id="currentDateTime">
<br><br>
<script>
var today = new Date();
var date = today.getFullYear()+'-'+(today.getMonth()+1)+'-'+today.getDate();
var time = today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds();
var dateTime = date+' '+time;
document.getElementById("currentDateTime").value = dateTime;
</script>