用jquery获取当前时间

本文介绍了一种使用JavaScript实现网页上实时更新当前日期和时间的方法。通过设置定时器每秒更新页面上的日期时间元素,实现了动态展示效果。该示例还包含了如何利用jQuery简化DOM操作。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

        <!DOCTYPE html>
<html class="no-js">
<head>
        <meta charset="UTF-8">
        <title>当期时间</title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
    <style type="text/css">
            .date{height:100px;line-height:100px;margin:0 auto;font-family:Arial, Helvetica, sans-serif;font-size:40px;
                border:solid 1px #ccc;box-shadow:0 0 3px rgba(0,0,0,0.3) inset;border-radius:5px;text-shadow:1px 1px 2px rgba(0,0,0,0.3);}
                .date strong{padding:0 10px;display:inline-block;height:100px;border-right:solid 1px #ccc;}
    </style>
</head>
<body>
        <h1>js简单的获取当前日期和时间</h1>
    <p class="date">
        <strong id="Y"></strong>
        <strong id="MH"></strong>
        <strong id="TD"></strong>
        <strong id="D"></strong>
        <strong id="H"></strong>
        <strong id="M"></strong>
        <strong id="S"></strong>
     </p>   
    <script type="text/javascript">
        $(document).ready(function () {


            setInterval(showTime, 1000);
            function timer(obj, txt) {
                obj.text(txt);
            }
            function showTime() {
                var today = new Date();
                var weekday = new Array(7)
                weekday[0] = "星期一"
                weekday[1] = "星期二"
                weekday[2] = "星期三"
                weekday[3] = "星期四"
                weekday[4] = "星期五"
                weekday[5] = "星期六"
                weekday[6] = "星期日"
                var y = today.getFullYear() + "年";
                var month = today.getMonth() + "月";
                var td = today.getDate() + "日";
                var d = weekday[today.getDay()];
                var h = today.getHours();
                var m = today.getMinutes();
                var s = today.getSeconds();
                timer($("#Y"), y);
                timer($("#MH"), month);
                timer($("#TD"), td);
                timer($("#D"), d);
                timer($("#H"), h);
                timer($("#M"), m);
                timer($("#S"), s);
            }
        })
    </script>
</body>

</html>



转自:http://www.codefans.net/jscss/code/3683.shtml

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值