html、js、jsp获取格式化时间_html js格式化时间-优快云博客

本文链接：https://blog.youkuaiyun.com/Gqiangqiang/article/details/104316779

这里提到的JS被我重新更改、添加了一些方法之后，上传到了npm,如果你使用了npm，那么现在可以使用npm i freedate来下载JS

虽然在JS获取格式化的时间并不难，我之前也写过怎么去获取并格式化，但是每次都要重新写也很麻烦，所以自己写了一个小JS。

function fd(timestr){
  //函数名fd； 传入的参数timestr（字符串）格式应该是类似fd(Y/M/D h:m:s)
}

最简单，也是最先要走的是获取每个小部分，Y(年)、M(月)、D(日)、h(时)、m(分)、s(秒)、w(星期)

  var datestr = timestr;        //赋值给内部变量以便进行操作
  var fdate = new Date();       //新建Date对象
  var Y = fdate.getFullYear();  //获取年
  var M = fdate.getMonth() + 1;  //获取月 从0开始，所以得到的数值加1
  var D = fdate.getDate();      //获取日
  var h = fdate.getHours();     //获取小时
  var m = fdate.getMinutes();   //获取分
  var s = fdate.getSeconds();   //获取秒
  var w = fdate.getDay();       //获取星期

但是在这里要注意的是，月、日、时、分、秒都是有小于10的数，所以我在这里需要做一个小优化，我这里是写了一个函数，以待调用，函数的作用就是把传入的数据前加入一个字符串“0”。

//对传进的值进行判断，如果小于10，则在其前面加入一个0；如输入3，返回结果为03。
function addZero(data){
  if(data < 10){
    data = "0" + data;
  }
  return data;
}

有了以上函数，需要的时候去调用就可以了；还有一个"w"，w获取到的值是1~7，分别代表了周一到周日，但是不能自动转化，所以依然需要我们自己手动转换

switch (w) {
  case 1:
    w = '星期一';
    break;
  case 2:
    w = '星期二';
    break;
  case 3:
    w = '星期三';
    break;
  case 4:
    w = '星期四';
    break;
  case 5:
    w = '星期五';
    break;
  case 6:
    w = '星期六';
    break;
  case 7:
    w = '星期日';
    break;
  default:
    w = '星期获取出错';
    break;
}

好了，此时可以说，基础的准备工作就已经做好了，接下来就是判断用户需要的格式了，在第一版中我的设定是这样的

参数1：在只有一个参数是，可能是分割符和true/false;当有两个参数时,第一个不能是true或false,不然第二个参数会被忽视
参数2：主要为了表示是否有含有时分秒值为true/false,当有两个参数时p必须是Booleand,否则参数视为无效。

但是后来发现这样其实真的不方便，不如改成大家都知道的，同时都习惯的模式fd("Y/M/D h:m:s")
之后，我们要判断字符串是否是空或undefined

	if(datestr == "" || datestr == undefined){
		datestr = "Y/MM/DD hh:mm:ss w";
	}

随后我们就可以判断字符串中的格式，因为不知道用户会使用什么样的分隔符，不好进行判断，但是我们底层的年月日时分秒是规定好的，我们可以对这些进行判断。

if(datestr.indexOf("Y") != -1){ //判断字符串中有Y时，将Y替换为获取到的年
  datestr = datestr.replace("Y", Y);
}
if(datestr.indexOf("M") != -1){ //是否有M
  if(datestr.indexOf("MM") != -1){ //如果有M，在判断是否有MM，如果有MM时，把月份放入addZero()函数中判断是否需要加0，然后将MM替换为有前置0的月份
    datestr = datestr.replace("MM", addZero(M));
  } else { //如果没有MM，则将M替换为获取到的月
    datestr = datestr.replace("M", M);
  }
}
// D为日  DD为有前置0的日
if(datestr.indexOf("D") != -1){
  if(datestr.indexOf("DD") != -1){
    datestr = datestr.replace("DD", addZero(D));
  } else {
    datestr = datestr.replace("D", D);
  }
}
// w为星期
if(datestr.indexOf("w") != -1){
  datestr = datestr.replace("w", w);
}
if(datestr.indexOf("h") != -1){
  if(datestr.indexOf("hh") != -1){
    datestr = datestr.replace("hh", addZero(h));
  } else {
    datestr = datestr.replace("h", h);
  }
}
if(datestr.indexOf("m") != -1){
  if(datestr.indexOf("mm") != -1){
    datestr = datestr.replace("mm", addZero(m));
  } else {
    datestr = datestr.replace("m", m);
  }
}
if(datestr.indexOf("s") != -1){
  if(datestr.indexOf("ss") != -1){
    datestr = datestr.replace("ss", addZero(s));
  } else {
    datestr = datestr.replace("s", s);
  }
}

这样的判断方式让我们可以更加灵活的格式化想要的时间，有需要时，我们还可以把月日放到年的前面：2019年3月23日=>23/03/2019

代码	返回值	例子
Y	返回年	如2020
M	返回月，没有前置0	1~12
MM	返回月，有前置的0	01~12
D	返回日，没有前置0	1~31
DD	返回日，有前置的0	01~31
h	返回小时，12小时制(暂未判断)	01~12
hh	返回小时，24小时制	01~24
m	返回分钟，没有前置0	1~60
mm	返回分钟，有前置的0	01~60
s	返回秒，没有前置0	1~60
ss	返回秒，有前置的0	01~60
w	返回星期，值为:星期X	如：星期四

使用总结：单个字母则是没有前置0的，双个的，都是有前置0的。

测试的例子：

fd() =>返回值 2020/02/04 13:58:49 星期二
fd(“Y/M/D hh:MM”) =>返回值 2020/2/4 13:58
fd(“Y年 MM月 DD日 hh点 mm分 ss秒”) =>返回值 2020年 02年 04日 13点 58分 49秒
fd(“现在是Y年 MM月 DD日 w”) =>返回值现在是2020年 02月 04日星期二

使用以上的JS我们就可以轻松做一个页面自动刷新的时钟了。
在html页面
HTML:

<div class="displayTime" id="displayTime">此处显示时间</div>

JS:

window.setInterval(function(){
	document.getElementById("displayTime").innerHTML = fd();/*具体格式自选*/
},300);/*自动刷新间隔*/

文档地址

如果觉得不错的话，可以在https://gitee.com/gqiangqiang/fastDate获取源码
或者点击这里下载（时间久了可能会更新，导致这里下载的和码云上的有所不同）