首先贴代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
.time {
width: 500px;
height: 400px;
background-color: #000000;
}
.nian,
.yue {
height: 50%;
color: aliceblue;
text-align: center;
font-size: 25px;
}
</style>
</head>
<body>
<div class="time">
<div class="nian"> </div>
<div class="yue"> </div>
</div>
<script>
function show1() {
var mydate = new Date();
var str = "" + mydate.getFullYear() + "年 ";
str += kk((mydate.getMonth() + 1)) + "月 ";
str += mydate.getDate() + "日 ";
str += " 星期" + kk(mydate.getDay()) + " ";
return str;
}
function show2() {
var mydate = new Date();
var hour = mydate.getHours() < 10 ? "0" + mydate.getHours() : mydate.getHours();
var minute = mydate.getMinutes() < 10 ? "0" + mydate.getMinutes() : mydate.getMinutes();
var second = mydate.getSeconds() < 10 ? "0" + mydate.getSeconds() : mydate.getSeconds();
var str = hour + " : " + minute + " ： " + second;
return str;
}
function kk(number) {
var str = "";
switch (number) {
case 0:
str = "日";
break;
case 1:
str = "一";
break;
case 2:
str = "二";
break;
case 3:
str = "三";
break;
case 4:
str = "四";
break;
case 5:
str = "五";
break;
case 6:
str = "六";
break;
case 7:
str = "七";
break;
case 8:
str = "八";
break;
case 9:
str = "九";
break;
case 10:
str = "十";
break;
case 11:
str = "十一";
break;
case 12:
str = "十二";
break;
};
return str;
}
function update() {
var nian = document.getElementsByClassName("nian")[0];
var yue = document.getElementsByClassName("yue")[0];
setInterval(function() {
var str1 = show1();
nian.innerHTML = str1;
var str2 = show2();
yue.innerHTML = str2
}, 1000)
}
setTimeout(update(), 0);
</script>
</body>
</html>js中settimeout和setInterval区别
setTimeout()方法
setTimeout()方法在等待指定的毫秒数之后执行一个函数。
语法:
1 2 3 |
|
例如，我们希望在用户按下“点击我！”按钮2秒后弹出一个提示框。
javascript代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<button onclick="setTimeout(gfg, 2000);">点击我！</button>
<script>
function gfg()
{
alert('欢迎来到PHP中文网！');
}
</script>
</body>
</html>一旦用户按下“按我”按钮，然后在暂停2秒后，会弹出一个框。输出:
setInterval()方法
setInterval()方法在每个给定的时间间隔重复一个给定的函数。
语法:
1 2 3 4 |
|
代码示例如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<p>我会说“你好”很多次！</p>
<p id="GFG"></p>
<script>
var myVar = setInterval(myTimer, 1000);
function myTimer()
{
document.getElementById("GFG").innerHTML += "<p>你好</p>";
}
</script>
</body>
</html>每隔一秒就会显示一条新的“你好”消息。
然后：
js 时间类讲解：
方法一：获取JavaScript 的时间使用内置的Date函数完成
var mydate = new Date();
mydate.getYear(); //获取当前年份(2位)
mydate.getFullYear(); //获取完整的年份(4位,1970-????)
mydate.getMonth(); //获取当前月份(0-11,0代表1月)
mydate.getDate(); //获取当前日(1-31)
mydate.getDay(); //获取当前星期X(0-6,0代表星期天)
mydate.getTime(); //获取当前时间(从1970.1.1开始的毫秒数)
mydate.getHours(); //获取当前小时数(0-23)
mydate.getMinutes(); //获取当前分钟数(0-59)
mydate.getSeconds(); //获取当前秒数(0-59)
mydate.getMilliseconds(); //获取当前毫秒数(0-999)
mydate.toLocaleDateString(); //获取当前日期
var mytime=mydate.toLocaleTimeString(); //获取当前时间
mydate.toLocaleString( ); //获取日期与时间1. 使用jquery获取设置时间
$(function(){
$("#time").text(getnowtime());
});
function getnowtime() {
var nowtime = new Date();
var year = nowtime.getFullYear();
var month = padleft0(nowtime.getMonth() + 1);
var day = padleft0(nowtime.getDate());
var hour = padleft0(nowtime.getHours());
var minute = padleft0(nowtime.getMinutes());
var second = padleft0(nowtime.getSeconds());
var millisecond = nowtime.getMilliseconds(); millisecond = millisecond.toString().length == 1 ? "00" + millisecond : millisecond.toString().length == 2 ? "0" + millisecond : millisecond;
return year + "-" + month + "-" + day + " " + hour + ":" + minute + ":" + second + "." + millisecond;
}
//补齐两位数
function padleft0(obj) {
return obj.toString().replace(/^[0-9]{1}$/, "0" + obj);
}
<p id="time"> </p>
2.格式一：（yyyy-MM-dd HH:mm:SS）
简约版
function show(){
var mydate = new Date();
var str = "" + mydate.getFullYear() + "年";
str += (mydate.getMonth()+1) + "月";
str += mydate.getDate() + "日";
return str;
}
alert ( show() );或者可以使用下面的
function getFormatDate(){
var nowDate = new Date();
var year = nowDate.getFullYear();
var month = nowDate.getMonth() + 1 < 10 ? "0" + (nowDate.getMonth() + 1) : nowDate.getMonth() + 1;
var date = nowDate.getDate() < 10 ? "0" + nowDate.getDate() : nowDate.getDate();
var hour = nowDate.getHours()< 10 ? "0" + nowDate.getHours() : nowDate.getHours();
var minute = nowDate.getMinutes()< 10 ? "0" + nowDate.getMinutes() : nowDate.getMinutes();
var second = nowDate.getSeconds()< 10 ? "0" + nowDate.getSeconds() : nowDate.getSeconds();
return year + "-" + month + "-" + date+" "+hour+":"+minute+":"+second;
}
var str = getFormatDate();
console.log(str);
=====================具体获取函数
样例：
alert(new Date().format("yyyy年MM月dd日"));
alert(new Date().format("MM/dd/yyyy"));
alert(new Date().format("yyyyMMdd"));
alert(new Date().format("yyyy-MM-dd hh:mm:ss"));方法二：重构Date对象：
Date.prototype.Format = function (fmt) {
var o = {
"M+": this.getMonth() + 1, //月份
"d+": this.getDate(), //日
"H+": this.getHours(), //小时
"m+": this.getMinutes(), //分
"s+": this.getSeconds(), //秒
"q+": Math.floor((this.getMonth() + 3) / 3), //季度
"S": this.getMilliseconds() //毫秒
};
if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
for (var k in o)
if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
return fmt;
}调用：
var nowTime=new Date().Format("yyyy-MM-dd");
console.log(nowTime);
