我试图使JavaScript代码,我可以把一个<span class="epoch>(unix timestamp)</span>
,它将设置为在用户的时区时间戳。
到目前为止,我有这样的代码:
let epoch = document.getElementsByClassName("epoch");
for (var i = 0; i < epoch.length; i++) {
let d = new Date(parseInt(epoch.item(i))).toDateString({ weekday: 'long', year: 'numeric', month: 'short', day: 'numeric' });
epoch.item(i).innerText = d;
}
字符串
我试着用alert(d);
替换epoch.item(i).innerText = d;
,但仍然不起作用。
HTML(不是完整版本,但仍然有相同的东西):
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Mesure73L</title>
<link href="index.css?v=1" rel="stylesheet" type="text/css" />
<script src="index.js?v=1" defer></script>
<script src="https://mesure.x10.mx/public_assets/main.js?v=1" defer></script>
<script id="mobile_navbar"></script>
<link rel="icon" type="image/x-icon" href="favicon.png">
</head>
<body>
<script id="replace_with_navbar" src="https://mesure.x10.mx/public_assets/navbar.js?v=1"></script>
<div id="content">
<p><span id="epoch">1700523189</span></p>
</div>
</body>
</html>
型
1条答案
按热度按时间5q4ezhmt1#
原始应答
在JavaScript代码中有一些需要纠正和改进的地方,以实现您正在寻找的功能。
1.
getElementsByClassName
中的错字:方法名应为getElementsByClassName
(复数),而不是getElementByClassName
(单数)。1.解析Timestamp:需要通过
epoch
元素的innerText
调用parseInt
函数,将epoch timestamp字符串转换为数字。1.日期:
toDateString
方法不接受任何参数。要格式化日期,您应该使用toLocaleDateString
,它允许指定格式选项。1.您正在使用ID作为epoch并调用Class。
字符串
说明:
getElementsByClassName("epoch")
返回一个包含已找到元素的实时HTMLCollection,类名为“epoch”。parseInt(epochs[i].innerText, 10)
将每个元素的内部文本解析为以10为底的整数(纪元时间戳)。new Date(timestamp * 1000)
从纪元时间戳创建一个新的Date对象。纪元时间以秒为单位,但JavaScript的Date对象构造函数需要毫秒,因此乘以1000。toLocaleDateString(undefined, {...})
根据用户的本地设置格式化日期(undefined
使其使用用户的区域设置)。选项对象指定如何表示日期的各个部分。epochs[i].innerText = formattedDate
用格式化的日期字符串替换每个span的内部文本。JSFiddle链接:https://jsfiddle.net/Termato/d1ytopuq/1/
更新:
使用以下代码:
型
然后对于JavaScript:
型
你可以在这里看到JSFiddle:https://jsfiddle.net/Termato/hr7ytf1p/5/
在你的问题中,你引用了一个类,但在你的代码中epoch是一个ID。这不起作用。要么使
<span class="epoch">
或更改JavaScript以针对ID:document.querySelector('#epoch');
请参见此JS Fiddle示例:https://jsfiddle.net/Termato/zmcaoxb9/2/