@
dany813 我通常是在前端页面里面有日期的地方放一个 time 标签,然后给它一个 datetime 属性,设置为 ISO8601 的格式。
<time datetime="2018-06-04T04:18:45Z">2018-06-04T04:18:45Z</time>
Safari 的 JS 引擎不能很好的理解其他日期格式,所以强烈建议 datetime 使用国际标准 ISO8601 格式
node.js 中,用 日期.toISOString() 可以把日期做成 ISO8601 格式的字符串( UTC+0 )
php 中,用 date('c', 1528085925) 可以把{以秒为单位的时间戳}整数做成 ISO8601 格式的字符串( UTC+0 )
以下代码放在前端,网页 onload 的时候调用一次 localTime() 即可,localTime 这个函数可以把页面中所有 time 标签找出,然后设置定时器,每 n 秒根据当前浏览器的时区和时间,去对比 time 标签的 datetime 属性,自动算出时差并以本地时间输出、更新标签的内容。(我知道回复不能用 markdown 不过还是用了,因为用 switch 很乱所以都换成了 if else )
比如:3 分前、4 小时前、昨天 16:20、2017 年 12 月 31 日 10:09
注意闰秒在这里被无视,但问题不大。
```js
function localTime () {
let _ = Math.floor
let pad = n => ('00' + n).slice(-2)
let localize = () => {
let $times = document.getElementsByTagName('time')
for (let i = 0; i < $times.length; i++) { // also for in / for of loop
let $time = $times[i]
let d = new Date($time.getAttribute('datetime')), // parse ISO 8601
dYea = d.getFullYear(),
dMon = d.getMonth() + 1, // getMonth returns (0-11)
dDay = d.getDate(), // NOT getDay
dHou = d.getHours(),
dMin = d.getMinutes(),
dSec = d.getSeconds()
let n = new Date(),
nYea = n.getFullYear(),
nMon = n.getMonth() + 1,
nDay = n.getDate(),
nHou = n.getHours(),
nMin = n.getMinutes(),
nSec = n.getSeconds()
let l = null
if (nYea - dYea === 0 && nMon - dMon === 0) {
let dayDiff = nDay - dDay
if (dayDiff === 0) {
let s = (
(nHou * 3600 + nMin * 60 + nSec) -
(dHou * 3600 + dMin * 60 + dSec)
)
if (s === 0)
l = '现在'
else if (s < 60 && s > 0)
l = s + ' 秒前'
else if (s < 3600 && s >= 60)
l = _(s / 60) + ' 分钟前'
else if (s >= 3600)
l = _(s / 3600) + ' 小时前'
}
else if (dayDiff === 1)
l = '昨天 ' + pad(dHou) + ':' + pad(dMin)
else if (dayDiff === 2)
l = '前天 ' + pad(dHou) + ':' + pad(dMin)
}
if (l === null)
l = (
dYea + ' 年 ' + dMon + ' 月 ' + dDay + ' 日 ' +
pad(dHou) + ':' + pad(dMin)
)
$time.innerText = l
}
}
setInterval(localize, 1000)
localize()
}
```