JavaScript简单习题

最新推荐文章于 2022-11-08 22:35:38 发布

梦里稻草人

最新推荐文章于 2022-11-08 22:35:38 发布

阅读量966

点赞数

分类专栏： HTML随笔

本文链接：https://blog.csdn.net/weixin_40693841/article/details/83477920

版权

HTML随笔专栏收录该内容

4 篇文章 0 订阅

订阅专栏

在网页上显示当前时间（客户端机器），一秒刷新一次。

有两种方法：一、运用Window对象中的setInterval()方法
代码如下：
自定义时间格式：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>现学现卖</title>
    <style type="text/css">
        .b{
            font-size:10px;
            color:#FF0000;
            text-align:center;
            font-weight:bolder;
            display:block;
            margin-top:10px;
        }
    </style>
</head>
<body>
    
    <script type="text/javascript">
        function f1(){
            date = new Date();
            var year = date.getFullYear();
            var month = date.getMonth() + 1;
            var day = date.getDay();
            var hours = date.getHours();
            var minutes = date.getMinutes();
            var seconds = date.getSeconds();
            var week;
            var hour;
            switch (day) {
                case 1:
                    week="星期一";
                    break;
                case 2:
                    week="星期二";
                    break;
                case 3:
                    week="星期三";
                    break;
                case 4:
                    week="星期四";
                    break;
                case 5:
                    week="星期五";
                    break;
                case 6:
                    week="星期六";
                    break;  
                default:
                    week="星期日";
                    break;
            }
            if(hours>12)
                hour = "下午" + f2(hours-12);
            else
                hour = "上午" + f2(hours);
            function f2(str){
                if(str<10)
                    return "0"+str;
                else
                    return  str;
            }
            text ="<font class='b'>"+"当前时间是："+year+"年"+f2(month)+"月"+f2(week)+hour+"："
                    +f2(minutes)+"："+f2(seconds)+"</font>";
            p1.innerHTML = text;
        }
        setInterval(f1,1000);
    </script>
    <p id="p1">asda</p>
</body>
</html>

简单求网页时间，即将function功能简化，但格式固定，代码如下：

function fun(){
        cg.innerHTML=new Date().toLocaleString();
    }
    setInterval("fun()",1000);

需要注意的是，setInterval(code,毫秒数)表现形式可以是setInterval(“fun()”,1000); 也可以是setInterval(fun,1000);

二、运用window对象中setTimeout()方法，虽然setTimeout不像setInterval能够循环周期执行指定代码，但可以通过嵌套方式将setTimeout嵌套进function中，达到循环目的。
代码如下：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>现学现卖</title>
    <style type="text/css">
        .b{
            font-size:10px;
            color:#FF0000;
            text-align:center;
            font-weight:bolder;
            display:block;
            margin-top:10px;
        }
    </style>
</head>
<body>
    <p id="p1">asda</p>
    <script type="text/javascript">
    	function fun(){
        	p1.innerHTML=new Date().toLocaleString();
   			setTimeout(fun,1000);
   		}
   		fun();
    </script>
    
</body>
</html>

梦里稻草人

关注

0
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
JavaScript简单习题

在网页上显示当前时间（客户端机器），一秒刷新一次。有两种方法：一、运用Window对象中的setInterval()方法代码如下：自定义时间格式：&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;title&gt;现学现卖&lt;/title&gt;
复制链接

扫一扫