每天JS_(一)应用Date对象
今天写JS有一点生疏啦。。所以要加强JS的学习啦!今天就写js中关于Date对象的应用:
Date对象
它是一个内置对象——而不是其它对象的属性,允许用户执行各种使用日期和时间的过程。
方法
getDate() 查看Date对象并返回日期
getDay() 返回星期几
getHours() 返回小时数
getMinutes() 返回分钟数
getMonth() 返回月份值
getSeconds() 返回秒数
getTime() 返回完整的时间
getTimezoneoffset() 返回时区偏差值(格林威治平均时间与运行脚本的计算机所处时区设置之间相差的小时数)
getYear() 返回年份
parse() 返回在Date字符串中自从1970年1月1日00:00:00以来的毫秒数(Date对象按照毫秒数的形式存储从那时起的日期和时间)但是注意,该方法当前不能正确运行
setDate() 改变Date对象的日期
setHours() 改变小时数
setMinutes() 改变分钟数
setMonth() 改变月份
setSeconds() 改变秒数
setTime() 改变完整的时间
setYear() 改变年份
toGMTString() 把Date对象的日期(一个数值)转变成一个GMT时间字符串,返回类似下面的值:Weds,15 June l997 14:02:02 GMT(精确的格式依赖于计算机上所运行的操作系统而变)
toLocaleString() 把Date对象的日期(一个数值)转变成一个字符串,使用所在计算机上配置使用的特定日期格式
UTC() 使用Date UTC(年、月、日、时、分、秒),以自从1970年1月1日00:00:00(其中时、分、秒是可选的)以来的毫秒数的形式返回日期
(1):时钟
(2):停留时间
(3):显示时间
(4):最后一次修改时间
(5):在浏览器状态栏中显示时间
应用其实非常灵活,算是练习一下手 ,下 一次 研究Date的扩展!
Date对象
它是一个内置对象——而不是其它对象的属性,允许用户执行各种使用日期和时间的过程。
方法
getDate() 查看Date对象并返回日期
getDay() 返回星期几
getHours() 返回小时数
getMinutes() 返回分钟数
getMonth() 返回月份值
getSeconds() 返回秒数
getTime() 返回完整的时间
getTimezoneoffset() 返回时区偏差值(格林威治平均时间与运行脚本的计算机所处时区设置之间相差的小时数)
getYear() 返回年份
parse() 返回在Date字符串中自从1970年1月1日00:00:00以来的毫秒数(Date对象按照毫秒数的形式存储从那时起的日期和时间)但是注意,该方法当前不能正确运行
setDate() 改变Date对象的日期
setHours() 改变小时数
setMinutes() 改变分钟数
setMonth() 改变月份
setSeconds() 改变秒数
setTime() 改变完整的时间
setYear() 改变年份
toGMTString() 把Date对象的日期(一个数值)转变成一个GMT时间字符串,返回类似下面的值:Weds,15 June l997 14:02:02 GMT(精确的格式依赖于计算机上所运行的操作系统而变)
toLocaleString() 把Date对象的日期(一个数值)转变成一个字符串,使用所在计算机上配置使用的特定日期格式
UTC() 使用Date UTC(年、月、日、时、分、秒),以自从1970年1月1日00:00:00(其中时、分、秒是可选的)以来的毫秒数的形式返回日期
(1):时钟
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml">
3
4 <head>
5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
6 <title>时钟</title>
7 <script type="text/javascript" language="javascript">
8 <!--
9 var dn
10 c1=new Image(); c1.src="img/c1.gif"
11 c2=new Image(); c2.src="img/c2.gif"
12 c3=new Image(); c3.src="img/c3.gif"
13 c4=new Image(); c4.src="img/c4.gif"
14 c5=new Image(); c5.src="img/c5.gif"
15 c6=new Image(); c6.src="img/c6.gif"
16 c7=new Image(); c7.src="img/c7.gif"
17 c8=new Image(); c8.src="img/c8.gif"
18 c9=new Image(); c9.src="img/c9.gif"
19 c0=new Image(); c0.src="img/c0.gif"
20 cb=new Image(); cb.src="img/cb.gif"
21 cam=new Image(); cam.src="img/cam.gif"
22 cpm=new Image(); cpm.src="img/cpm.gif"
23 function extract(h,m,s,type){
24 if (!document.images)
25 return
26 if (h<=9){
27 document.images.a.src=cb.src
28 document.images.b.src=eval("c"+h+".src")
29 }
30 else {
31 document.images.a.src=eval("c"+Math.floor(h/10)+".src")
32 document.images.b.src=eval("c"+(h%10)+".src")
33 }
34 if (m<=9){
35 document.images.d.src=c0.src
36 document.images.e.src=eval("c"+m+".src")
37 }
38 else {
39 document.images.d.src=eval("c"+Math.floor(m/10)+".src")
40 document.images.e.src=eval("c"+(m%10)+".src")
41 }
42 if (s<=9){
43 document.g.src=c0.src
44 document.images.h.src=eval("c"+s+".src")
45 }
46 else {
47 document.images.g.src=eval("c"+Math.floor(s/10)+".src")
48 document.images.h.src=eval("c"+(s%10)+".src")
49 }
50 if (dn=="AM") document.j.src=cam.src
51 else document.images.j.src=cpm.src
52 }
53 function show(){
54 if (!document.images)
55 return
56 var Digital=new Date()
57 var hours=Digital.getHours()
58 var minutes=Digital.getMinutes()
59 var seconds=Digital.getSeconds()
60 dn="AM"
61 if ((hours>=12)&&(minutes>=1)||(hours>=13)){
62 dn="PM"
63 hours=hours-12
64 }
65 if (hours==0)
66 hours=12
67 extract(hours,minutes,seconds,dn)
68 setTimeout("show()",1000)
69 }
70 //-->
71 </script>
72 </head>
73
74 <body onload="show()">
75 <img src="cb.gif" name="a" alt="cb.gif"/>
76 <img src="cb.gif" name="b" alt="cb.gif"/>
77 <img src="colon.gif" name="c" alt="img/colon.gif"/>
78 <img src="cb.gif" name="d" alt="cb.gif"/>
79 <img src="cb.gif" name="e" alt="cb.gif"/>
80 <img src="colon.gif" name="f" alt="img/colon.gif"/>
81 <img src="cb.gif" name="g" alt="cb.gif"/>
82 <img src="cb.gif" name="h" alt="cb.gif"/>
83 <img src="cam.gif" name="j" alt="cam.gif"/>
84 <br/>
85 <label id="说明">如果colon.gif不能加载就换成":"</label>
86 </body>
87
88 </html>
89
2 <html xmlns="http://www.w3.org/1999/xhtml">
3
4 <head>
5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
6 <title>时钟</title>
7 <script type="text/javascript" language="javascript">
8 <!--
9 var dn
10 c1=new Image(); c1.src="img/c1.gif"
11 c2=new Image(); c2.src="img/c2.gif"
12 c3=new Image(); c3.src="img/c3.gif"
13 c4=new Image(); c4.src="img/c4.gif"
14 c5=new Image(); c5.src="img/c5.gif"
15 c6=new Image(); c6.src="img/c6.gif"
16 c7=new Image(); c7.src="img/c7.gif"
17 c8=new Image(); c8.src="img/c8.gif"
18 c9=new Image(); c9.src="img/c9.gif"
19 c0=new Image(); c0.src="img/c0.gif"
20 cb=new Image(); cb.src="img/cb.gif"
21 cam=new Image(); cam.src="img/cam.gif"
22 cpm=new Image(); cpm.src="img/cpm.gif"
23 function extract(h,m,s,type){
24 if (!document.images)
25 return
26 if (h<=9){
27 document.images.a.src=cb.src
28 document.images.b.src=eval("c"+h+".src")
29 }
30 else {
31 document.images.a.src=eval("c"+Math.floor(h/10)+".src")
32 document.images.b.src=eval("c"+(h%10)+".src")
33 }
34 if (m<=9){
35 document.images.d.src=c0.src
36 document.images.e.src=eval("c"+m+".src")
37 }
38 else {
39 document.images.d.src=eval("c"+Math.floor(m/10)+".src")
40 document.images.e.src=eval("c"+(m%10)+".src")
41 }
42 if (s<=9){
43 document.g.src=c0.src
44 document.images.h.src=eval("c"+s+".src")
45 }
46 else {
47 document.images.g.src=eval("c"+Math.floor(s/10)+".src")
48 document.images.h.src=eval("c"+(s%10)+".src")
49 }
50 if (dn=="AM") document.j.src=cam.src
51 else document.images.j.src=cpm.src
52 }
53 function show(){
54 if (!document.images)
55 return
56 var Digital=new Date()
57 var hours=Digital.getHours()
58 var minutes=Digital.getMinutes()
59 var seconds=Digital.getSeconds()
60 dn="AM"
61 if ((hours>=12)&&(minutes>=1)||(hours>=13)){
62 dn="PM"
63 hours=hours-12
64 }
65 if (hours==0)
66 hours=12
67 extract(hours,minutes,seconds,dn)
68 setTimeout("show()",1000)
69 }
70 //-->
71 </script>
72 </head>
73
74 <body onload="show()">
75 <img src="cb.gif" name="a" alt="cb.gif"/>
76 <img src="cb.gif" name="b" alt="cb.gif"/>
77 <img src="colon.gif" name="c" alt="img/colon.gif"/>
78 <img src="cb.gif" name="d" alt="cb.gif"/>
79 <img src="cb.gif" name="e" alt="cb.gif"/>
80 <img src="colon.gif" name="f" alt="img/colon.gif"/>
81 <img src="cb.gif" name="g" alt="cb.gif"/>
82 <img src="cb.gif" name="h" alt="cb.gif"/>
83 <img src="cam.gif" name="j" alt="cam.gif"/>
84 <br/>
85 <label id="说明">如果colon.gif不能加载就换成":"</label>
86 </body>
87
88 </html>
89
(2):停留时间
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml">
3
4 <head>
5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
6 <title>停留的时间</title>
7 </head>
8
9 <body onunload="stay()">
10 <script type="text/javascript">
11
12 pageOpen = new Date();
13 function stay() {
14 pageClose = new Date();
15 minutes = (pageClose.getMinutes() - pageOpen.getMinutes());
16 seconds = (pageClose.getSeconds() - pageOpen.getSeconds());
17 time = (seconds + (minutes * 60));
18 time = (time + " 秒钟");
19 alert('您在这儿停留了' + time + '.欢迎下次再来!');
20 }
21
22 </script>
23
24 </body>
25
26 </html>
27
2 <html xmlns="http://www.w3.org/1999/xhtml">
3
4 <head>
5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
6 <title>停留的时间</title>
7 </head>
8
9 <body onunload="stay()">
10 <script type="text/javascript">
11
12 pageOpen = new Date();
13 function stay() {
14 pageClose = new Date();
15 minutes = (pageClose.getMinutes() - pageOpen.getMinutes());
16 seconds = (pageClose.getSeconds() - pageOpen.getSeconds());
17 time = (seconds + (minutes * 60));
18 time = (time + " 秒钟");
19 alert('您在这儿停留了' + time + '.欢迎下次再来!');
20 }
21
22 </script>
23
24 </body>
25
26 </html>
27
(3):显示时间
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>显示时间</title>
<script language="javascript" type="text/javascript">
<!--
var todaydate=new Date();
date = todaydate.getDate();
month = todaydate.getMonth();
year = todaydate.getFullYear();
document.write("今天是");
document.write("<br>");
if(navigator.appName == "Netscape")
{
document.write(1900+year);
document.write("年");
document.write(month);
document.write("月");
document.write(date);
document.write("日");
document.write("<br>")
}
if(navigator.appVersion.indexOf("MSIE") != -1)
{
document.write(year);
document.write("年");
document.write(month);
document.write("月");
document.write(date);
document.write("日");
document.write("<br>")
}
if (todayDate.getDay() == 5) document.write("星期五")
if (todayDate.getDay() == 6) document.write("星期六")
if (todayDate.getDay() == 0) document.write("星期日")
if (todayDate.getDay() == 1) document.write("星期一")
if (todayDate.getDay() == 2) document.write("星期二")
if (todayDate.getDay() == 3) document.write("星期三")
if (todayDate.getDay() == 4) document.write("星期四")
//-->
</script>
</head>
<body>
<div>
<div style="height: 45px; width: 570px"><label id="Label1"></label></div>
</div>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>显示时间</title>
<script language="javascript" type="text/javascript">
<!--
var todaydate=new Date();
date = todaydate.getDate();
month = todaydate.getMonth();
year = todaydate.getFullYear();
document.write("今天是");
document.write("<br>");
if(navigator.appName == "Netscape")
{
document.write(1900+year);
document.write("年");
document.write(month);
document.write("月");
document.write(date);
document.write("日");
document.write("<br>")
}
if(navigator.appVersion.indexOf("MSIE") != -1)
{
document.write(year);
document.write("年");
document.write(month);
document.write("月");
document.write(date);
document.write("日");
document.write("<br>")
}
if (todayDate.getDay() == 5) document.write("星期五")
if (todayDate.getDay() == 6) document.write("星期六")
if (todayDate.getDay() == 0) document.write("星期日")
if (todayDate.getDay() == 1) document.write("星期一")
if (todayDate.getDay() == 2) document.write("星期二")
if (todayDate.getDay() == 3) document.write("星期三")
if (todayDate.getDay() == 4) document.write("星期四")
//-->
</script>
</head>
<body>
<div>
<div style="height: 45px; width: 570px"><label id="Label1"></label></div>
</div>
</body>
</html>
(4):最后一次修改时间
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>上次修改日期</title>
</head>
<body onload="modified()">
<script type="text/javascript">
function modified()
{
document.form1.textfield.value = document.lastModified
}
</script>
<form name="form1">
上次修改日期:
<input type="text" name="textfield"/>
</form>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>上次修改日期</title>
</head>
<body onload="modified()">
<script type="text/javascript">
function modified()
{
document.form1.textfield.value = document.lastModified
}
</script>
<form name="form1">
上次修改日期:
<input type="text" name="textfield"/>
</form>
</body>
</html>
(5):在浏览器状态栏中显示时间
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题 1</title>
<script type="text/javascript">
var timerID = null;
var timerRunning = false;
function stopclock (){
if(timerRunning)
clearTimeout(timerID);
timerRunning = false;
}
function showtime () {
var now = new Date();
var hours = now.getHours();
var minutes = now.getMinutes();
var seconds = now.getSeconds()
var timeValue = "" + ((hours >12) ? hours -12 :hours)
timeValue += ((minutes < 10) ? ":0" : ":") + minutes
timeValue += ((seconds < 10) ? ":0" : ":") + seconds
timeValue += (hours >= 12) ? " P.M." : " A.M."
window.status = timeValue;
timerID = setTimeout("showtime()",1000);
timerRunning = true;
}
function startclock () {
stopclock();
showtime();
}
</script>
</head>
<body onload="startclock()">
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题 1</title>
<script type="text/javascript">
var timerID = null;
var timerRunning = false;
function stopclock (){
if(timerRunning)
clearTimeout(timerID);
timerRunning = false;
}
function showtime () {
var now = new Date();
var hours = now.getHours();
var minutes = now.getMinutes();
var seconds = now.getSeconds()
var timeValue = "" + ((hours >12) ? hours -12 :hours)
timeValue += ((minutes < 10) ? ":0" : ":") + minutes
timeValue += ((seconds < 10) ? ":0" : ":") + seconds
timeValue += (hours >= 12) ? " P.M." : " A.M."
window.status = timeValue;
timerID = setTimeout("showtime()",1000);
timerRunning = true;
}
function startclock () {
stopclock();
showtime();
}
</script>
</head>
<body onload="startclock()">
</body>
</html>
应用其实非常灵活,算是练习一下手 ,下 一次 研究Date的扩展!