金诚交通-工程师之家(http://www.jcjtbook.com) ——金 诚 交 流 , 书 山 有 路 !
在网络内加入日期、时间
发起人:yang007  回复数:0  浏览数:2985  最后更新:2010/11/26 19:39:53 by yang007

发表新帖  帖子排序:
2010/11/26 19:39:54
yang007





角  色:管理员
发 帖 数:91
注册时间:2010/6/17
在网络内加入日期、时间
  很多网友在浏览网页时应该会发现很多网页有显示时间和日期的功能,下面

我们使用JavaScript来实现这个功能,同时通过此例来了解网络编程语言

JavaScript的作用,这个实例原理就是通过JavaScript程序的执行使个人客户端

机器的日期和时间在网页上显示。
   你可以复制代码,先在编辑窗口找到要添加时间的地方,点击鼠标,再到代


码窗口,不要随意点击鼠标,找到代码的光标处,粘贴即可,不过尽量避免加在

一些小的成对的标记之间。
时间日期
效果:
欢迎光临,现在的时间是:19:47
今天日期:为 11/26/2010


源程序如下:
<script language="LiveScript">


<!-- Hiding

today = new Date()

document.write("欢迎光临现在时间是  ",today.getHours(),":",

today.getMinutes())

document.write("<br>今天日期为  ", today.getMonth()+1,

"/",today.getDate(),"/",today.getYear());

// end hiding contents -->

</script>
     在本例中,我们建立了一个日期变数today= new Date()来完成的。如果没


有特别指定时间与日期的话,浏览器将会采用本地客户端机器的时间。
 本教程日期 
 效果: 晚上好!2010年11月26日星期五


代码:
<script language=JavaScript>
<!-- Begin
now = new Date(),hour = now.getHours()
if(hour < 5){document.write("明天不用上班了吗?")}
else if (hour < 8){document.write("早上好!")}
else if (hour < 12){document.write("上午好!")}
else if (hour < 14){document.write("中午好!")}
else if (hour < 18){document.write("下午好!")}
else if (hour < 22){document.write("晚上好!")}
else if (hour < 24){document.write("夜深了!要注意身体呀!")}
// End -->
</script>
<script language=JavaScript>
<!--
function visitor()
{
//define variable
var Jsay;
var Jdayr;
var Jtoday= new Date();
var Jyear= Jtoday.getYear(); Jmonth=Jtoday.getMonth();
Jday= Jtoday.getDay(); Jdate=Jtoday.getDate();
Jhrs= Jtoday.getHours(); Jmin=Jtoday.getMinutes();
Jsec=Jtoday.getSeconds();
document.write("<font color=red>");

document.write('\t'+"<font color=red>"+"</font>");
document.write("<font color=black>"+"</font>");
document.write('<font color=black>'+'</font>'+Jyear+"<font


color=black>"+"年"+"</font>" );
document.write((Jmonth+1));
document.write("<font color=black>"+"月"+"</font>"+Jdate+"<font


color=black>"+"日"+"</font>");

if (Jday==1)
document.write("<font color=black>"+"星期"+"</font>"+"<font


color=red>"+"一"+"</font>");

else if (Jday==2)
document.write("<font color=black>"+"星期"+"</font>"+"<font


color=red>"+"二"+"</font>");

else if (Jday==3)
document.write("<font color=black>"+"星期"+"</font>"+"<font


color=red>"+"三"+"</font>");

else if (Jday==4)
document.write("<font color=black>"+"星期"+"</font>"+"<font


color=red>"+"四"+"</font>");

else if (Jday==5)
document.write("<font color=black>"+"星期"+"</font>"+"<font


color=red>"+"五"+"</font>");

else if (Jday==6)
document.write("<font color=black>"+"星期"+"</font>"+"<font


color=red>"+"六"+"</font>");

else if (Jday==7)
document.write("<font color=black>"+"星期"+"</font>"+"<font


color=red>"+"日"+"</font>");
}
visitor();
// -->
</script>
数字时钟


效果 : 现在时刻:19:57:12


代码:

<span id="liveclock" style"=width: 109px; height: 15px"></span>
<SCRIPT language=javascript>
function www_helpor_net()
{
var Digital=new Date()
var hours=Digital.getHours()
var minutes=Digital.getMinutes()
var seconds=Digital.getSeconds()
if(minutes<=9)
minutes="0"+minutes
if(seconds<=9)
seconds="0"+seconds
myclock="现在时刻:<font size='5' face='Arial


black'>"+hours+":"+minutes+":"+seconds+"</font>"
if(document.layers){document.layers.liveclock.document.write(myclock)
document.layers.liveclock.document.close()
}else if(document.all)
liveclock.innerHTML=myclock
setTimeout("www_helpor_net()",1000)
}
www_helpor_net();
//-->
</SCRIPT>
五种风格时间显示


效果 :
风格一:星期五,11月26日,2010年
风格二:7:47:06,下午
风格三:星期五,11月26日,2010年,7:47:06,下
风格四:11/26/10
风格五:19:47:06


代码:

<SCRIPT language="javascript">
<!--
function initArray()
{
for(i=0;i<initArray.arguments.length;i++)
this=initArray.arguments;
}
var isnMonths=new initArray("1月","2月","3月","4月","5月","6月","7


月","8月","9月","10月","11月","12月");
var isnDays=new initArray("星期日","星期一","星期二","星期三","星期


四","星期五","星期六","星期日");
today=new Date();
hrs=today.getHours();
min=today.getMinutes();
sec=today.getSeconds();
clckh=""+((hrs>12)?hrs-12:hrs);
clckm=((min<10)?"0":"")+min;clcks=((sec<10)?"0":"")+sec;
clck=(hrs>=12)?"下午":"上午";
var stnr="";
var ns="0123456789";
var a="";
function getFullYear(d)
{
yr=d.getYear();if(yr<1000)
yr+=1900;return yr;}
document.write("<table>");


//下面各行分别是一种风格,把不需要的删掉即可
document.write("<TR><TD>风格一:</TD><TD>"+isnDays[today.getDay()]


+","+isnMonths[today.getMonth()]+""+today.getDate()+"日,"+getFullYear

(today)+"年");
document.write("<TR><TD>风格


二:</TD><TD>"+clckh+":"+clckm+":"+clcks+""+clck+"</TD></TR>");
document.write("<TR><TD>风格三:</TD><TD>"+isnDays[today.getDay()]


+","+isnMonths[today.getMonth()]+""+today.getDate()+"日,"+getFullYear

(today)+"年 "+clckh+":"+clckm+":"+clcks+""+clck+"</TD></TR>");
document.write("<TR><TD>风格四:</TD><TD>"+(today.getMonth()+1)


+"/"+today.getDate()+"/"+(getFullYear(today)+"").substring(2,4)

+"</TD></TR>");
document.write("<TR><TD>风格


五:</TD><TD>"+hrs+":"+clckm+":"+clcks+"</TD></TR>");
document.write("</table>");
//-->
</SCRIPT>



金诚论坛,畅所欲言的论坛,大家的论坛! 金诚交通-工程师之家(http://www.jcjtbook.com)