JQuery实现网页上时间动态显示

最新推荐文章于 2024-08-02 20:11:41 发布

老神叨叨

最新推荐文章于 2024-08-02 20:11:41 发布

阅读量1.2k

点赞数

分类专栏： JQuery 文章标签： jquery 页面显示时间 html javascript js

本文链接：https://blog.csdn.net/Braveboycs/article/details/40313573

版权

JQuery 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

网页上实现时间显示，是JQuery中最简单的一个小功能。需要注意的是尽量不要使用递归调用，否则网页打开的时间一长就会造成内存泄露。

实现代码如下：

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<link type="text/css" rel="stylesheet" href="css/style.css" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){function timereset() {
var datetime = new Date();
var hour = datetime.getHours() < 10 ? "0 " + datetime.getHours() : datetime.getHours();
var min = datetime.getMinutes() < 10 ? "0" + datetime.getMinutes() : datetime.getMinutes();
var sec = datetime.getSeconds() < 10 ? "0" + datetime.getSeconds() : datetime.getSeconds();
var year = datetime.getFullYear();
var mon = datetime.getMonth() + 1 < 10 ? "0" + (datetime.getMonth() + 1) : datetime.getMonth() + 1;
var day = datetime.getDate() < 10 ? "0" + datetime.getDate() : datetime.getDate();
$("#time").html(hour + ":" + min + "<span class='second'> "+sec+"</span>");
$("#date").html(year + "年" + mon + "月" + day + "日");}
setInterval(timereset,1000);}
);
</script>
<title>登陆</title>
</head>
<body>