Javascript脚本特效示例:[33]时间日期转换

2025-11-02 03:58:35

1、在桌机上新建文本文档,命名为晓博JavaScript特效测试.txt,在文本文档里中入HTML文档的基本元素如下,并保存。

<html>

<head>

<title>晓博JavaScript特效测试</title>

</head>

<body>

<div id="zy">  

  <div id="login"></div>

  <div id="daohang">

  <ul>

  <li><a href="index.html">首页</a></li>

  <li><a href="jianjie.html">七夕简介</a></li>

  <li><a href="#">七夕节传说</a></li>

  <li><a href="#">七夕节习俗</a></li>

  <li><a href="#">诗词& 歌谣</a></li>

  <li><a href="#">七夕节寄语</a></li>

  </ul>

  </div>

</div>

</body>

</html>

Javascript脚本特效示例:[33]时间日期转换

Javascript脚本特效示例:[33]时间日期转换

2、第一步:把如下代码加入<head>区域中

<script Language="JavaScript">

<!-- Helpers for JSI page...

// Navigation - Start

function goback(){

alert("Good Bye!");

history.go(-1);

}

function getname(str) {

        alert("Hi, "+ str+"!");

}

function gettheDate() {

stopclock();

Todays = new Date();

TheDate = "" + (Todays.getMonth()+ 1) +" / "+ Todays.getDate() + " / " + 

Todays.getYear() 

document.clock.face.value = TheDate;

}

function showit () {

        var now = new Date();

        var hours = now.getHours();

        var minutes = now.getMinutes();

        var seconds = now.getSeconds();

          stopclock();

          TotalTime = (minutes > GetTotal)? (minutes-GetTotal):TotalTime;

        document.clock.face.value = TotalTime + " in minutes ";

}

// Navigation - Stop

// Netscapes Clock - Start

// this code was taken from Netscapes JavaScript documentation at

// www.netscape.com on Jan.25.96

var timerID = null;

var TotalTime = 0;

var GetTotal = 0;

var timerRunning = false;

function stopclock (){

        if(timerRunning)

                clearTimeout(timerID);

        timerRunning = false;

}

function startclock () {

        // Make sure the clock is stopped

        var now = new Date();

        stopclock();

          GetTotal=now.getMinutes();

        gettheDate()

        showtime();

}

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."

        document.clock.face.value = timeValue;

        timerID = setTimeout("showtime()",1000);

        timerRunning = true;

}

function showtimer () {

        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."

          document.clock.Tspent.value = timeValue;

        timerID = setTimeout("showtime()",1000);

        timerRunning = true;

}

// Netscapes Clock - Stop

// end Helpers -->

</script>

3、第二步:把如下代码加入<body>区域中

<form name="clock" onSubmit="0">

       <input     type=button value="Time" size=12 onClick="showtime()">

        <input    type=button value="Date" size=12 onClick="gettheDate()">

        <input type="text" name="face" size=12 value="" StartTimer()>

</form>

4、第三步:把<body>区中内容改为如下,并重名文档为HTML文件

<body bgcolor="#fef4d9" onLoad="startclock()">

5、用IE浏览器打开晓博JavaScript特效测试.html文件,可以看到时间日期转换特效,如下图

Javascript脚本特效示例:[33]时间日期转换

Javascript脚本特效示例:[33]时间日期转换

Javascript脚本特效示例:[33]时间日期转换

Javascript脚本特效示例:[33]时间日期转换

Javascript脚本特效示例:[33]时间日期转换

声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
猜你喜欢