JavaScript-动态显示系统时间

最新推荐文章于 2021-10-17 16:14:39 发布

谢飞飞啦

最新推荐文章于 2021-10-17 16:14:39 发布

阅读量489

点赞数

分类专栏： JS学习日志文章标签： js

本文链接：https://blog.csdn.net/weixin_46217915/article/details/113177744

版权

JS学习日志专栏收录该内容

2 篇文章 0 订阅

订阅专栏

提示：小萌新一枚

文章目录

前言
一、代码奉上

前言

涉及到的知识点：
Date()对象：脚本内置对象，用于处理时间和日期
window.onload：页面加载时触发事件
setTimeout（***，***）时间间隔

一、代码奉上

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Ti</title>
    <style type="text/css">
        .inputTxt{
            width: 50%;height: 500px;font-size: 50px;text-align: center;
        }
    </style>
    <script type="text/javascript" >

        window.onload=showTime;
        //先定义一个函数
        function showTime()
        {
            //new一个时间对象
            var myDate=new Date();

            //对象中分化出时分秒小对象
            var hour=myDate.getHours();
            var minutes=myDate.getMinutes();
            var seconds=myDate.getSeconds();
            //如果时分秒小于10就在前面加上0补位
            if(hour<10)
            {
                hour="0"+hour;
            }
            if(minutes<10)
            {
                minutes="0"+minutes;
            }
            if(seconds<10)
            {
                seconds="0"+seconds;
            }
			//将一个完整的输出内容赋给time
            var time="实时时间："+hour+":"+minutes+":"+seconds;
            //向名叫“myFrom”的表（from）下，名叫“myText”的input的value写入******
            document.myFrom.myText.value=time;
            //通过setTimeout(""),每隔****刷新一次
            setTimeout("showTime()",1000);
        }
        

    </script>
</head>
<body>
<center>
    <form name="myFrom">
        <input type="text" name="myText" value=" " class="inputTxt" >
<!--        <input type="button" οnclick="showTime()" value="开始">-->
    </form>
</center>
</body>
</html>

谢飞飞啦

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
JavaScript-动态显示系统时间

提示：小萌新一枚文章目录前言一、代码奉上前言涉及到的知识点：Date()对象：脚本内置对象，用于处理时间和日期window.onload：页面加载时触发事件setTimeout（***，***）时间间隔一、代码奉上<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Ti</title> <style
复制链接

扫一扫

专栏目录