使用JS获取当前时间并且改变时间显示格式

使用JS改变获取时间的格式

刚开始学习前端不久，昨天突然想做一个简单的显示时间的页面，就当作是钟表了（哈哈，买不起表吗？）

写的过程中，发现JS自带的获取时间功能在视觉上总觉得不是很舒服，比如 9:08 显示的是 9:8 ，这个确实没有问题，但是就是看着不舒服，所以呢，网上查了查，学习了一番，我做成了 9:08 的样子。另外还有获取的星期是从0开始的数字，最后都改了改，做的样子还算看过眼。

先看一下效果

虽然样子简陋了不少，但是这也是我的第一个小Demo，个人还是非常开心的。

JS获取时间的方法

我是用这样一段代码来获取当前时间的

	function time(){
   
	    var time = new Date();
	    document.getElementById("time").innerHTML=
	        time.getHours()+":"+
	        time.getMinutes()+":"+
	        time.getSeconds();
	}

我是在 <p> 标签中写的，JS获取时间后，传给 <p> 标签就行，最后出来的效果是这样的

还有这样的

很明显，当时间数都是两位的时候，看不出来有什么不合适，但是有一位数字的时候就很明显了，而且这个会随着时间的变化，不断左右动，当作钟表那肯定是不行的喽（还嫌晃眼呢，哈哈）。虽然说我对美没有太大的追求，但是这个样子，还是很不舒服的。

再看看windows系统的

确实漂亮不少，那么，这个该怎么弄呢？

改变获取到的时间的格式

大概思路是这样的

获取到时间后，先判断是否大于10，小于10的话，就在该数字前面加一个字符串 “0” ，这就是一个非常简单的方法，实现起来呢，也只需要一行代码，所以上面的代码就可以改成下面这个样子

	function time() {
   
        var h = new Date().getHours();
        h = h < 10 ? ("0" + h) : h;
        var m = new Date().getMinutes();
        m = m < 10 ? ("0" + m) : m;
        var s = new Date().getSeconds();
        s = s < 10 ? ("0" + s) : s;
        document.getElementById("time").innerHTML= h + ":" + m + ":" + s;
    }

然后得到的样子就是酱紫的

em·········可以，那时间的就到这里

日期和星期的获取和格式转换

日期的获取和时间的获取是一样的，使用对应的函数便可以，考虑到，日期一般是不需要在给个位的时候加 “0” 的，所以就不需要上面对时间的处理了，所以，我就写了下面的代码

	function date