JavaScript：日期格式化-毫秒時間

回給定毫秒數(shù)的可讀格式

思路

將ms除以適當(dāng)?shù)闹担垣@得day、hour和minute的值;
將Object.entries() 與Array.prototype.filter()配合使用以僅保留非零值;
使用Array.prototype.map()為每個值創(chuàng)建字符串，并適當(dāng)?shù)剡M行復(fù)數(shù)化;
使用String.prototype.join(' ')將值組合成字符串。

實現(xiàn)代碼

const formatDuration = ( ms ) => {
  if(ms < 0) ms = -ms;

  let time = {
    day: Math.floor(ms / 86400000),
    hour: Math.floor(ms / 3600000) % 24,
    minute: Math.floor(ms / 60000) % 60
  }

  return Object.entries(time)
    .filter(val => val[1] !== 0)
    .map(([key, val])=>{
      if(key === 'day') return `${val}天`
      
      if(key === 'hour') return `${val}時`

      if(key === 'minute') return `${val}分`
    })
    .join(' ');
}

測試代碼

let t1 = formatDuration(62341001);
console.log(t1);

let t2 = formatDuration(34325055574);
console.log(t2);

測試結(jié)果

17時 19分
397天 6時 44分

代碼實現(xiàn)參閱：formatDuration - 30 seconds of code

TML的pre標簽

定義和用法

<pre> 標簽定義預(yù)先格式化的文本。

<pre> 元素中的文本以等寬字體顯示，文本保留空格和換行符。文本將完全按照 HTML 源代碼中所寫的方式顯示。

使用（保留原有格式），和div區(qū)別

執(zhí)行結(jié)果如下：

在layui中使用，未使用pre,結(jié)果如下：在一行顯示，不太好看和理解

layer.alert(JSON.stringify(data,null,4));

使用pre標簽后,結(jié)果如下：json格式化展示出來了,易于理解和好看，方便分析。

layer.alert("<pre>"+JSON.stringify(data,null,4)+"</pre>");

2024-2-26

Go語言渲染html頁面的時候，經(jīng)常需要對日期進行格式化，一種可以在渲染之前，就將變量轉(zhuǎn)換成對應(yīng)的字符串；另一種根據(jù)template的語法在渲染模板的時候進行格式化。

語法：

{{ .<vaiable>.Format <layout>}}

變量后面加Format 格式

layout格式跟time包里面的定義是一樣的：

月份 1,01,Jan,January

日 2,02,_2

時 3,03,15,PM,pm,AM,am

分 4,04

秒 5,05

年 06,2006

時區(qū) -07,-0700,Z0700,Z07:00,-07:00,MST

周幾 Mon,Monday

比如小時的表示(原定義是下午3時，也就是15時)

3 用12小時制表示，去掉前導(dǎo)0

03 用12小時制表示，保留前導(dǎo)0

15 用24小時制表示，保留前導(dǎo)0

03pm 用24小時制am/pm表示上下午表示，保留前導(dǎo)0

3pm 用24小時制am/pm表示上下午表示，去掉前導(dǎo)0

又比如月份

1 數(shù)字表示月份，去掉前導(dǎo)0

01 數(shù)字表示月份，保留前導(dǎo)0

Jan 縮寫單詞表示月份

January 全單詞表示月份

例子：

type Log struct{
 ID int
 Info string
 CreateAt time.Time

}

在html里面調(diào)用

默認格式：

<span>{{ .CreateAt }}</span>

格式化：

<span> {{ .CreateAt.Format "2006-01-02 15:04:05" }} </span>

在線咨詢

上一篇：html5多圖上傳插件支持拖拽-zyUpload
下一篇：HTML5基礎(chǔ)學(xué)習(xí) 19-表單

您的項目需求

*請認真填寫需求信息，我們會在24小時內(nèi)與您取得聯(lián)系。

整合營銷服務(wù)商