输出当前的时间（函数封装）

最新推荐文章于 2022-12-12 23:12:29 发布
最新推荐文章于 2022-12-12 23:12:29 发布
阅读量443 收藏 1
点赞数 2
分类专栏： js练习题 文章标签： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44573096/article/details/106117505
版权

要求：用计时器把当前时间的时分秒每1秒钟在页面的p标签中展示一次时间格式(xx:xx:xx的格式)，做出一个时钟效果，第一秒页面也要展示一次时间
代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <p></p>
    <script src="myjs.js"></script>
    <script>
        var oP=document.getElementsByTagName("p")[0];
        // setInterval(function(){
        //     var oTime=new Date();   //每次开始计时器之前，先获取一个时间对象
        //     oP.innerHTML=timeFormat(oTime)[0];    //因为返回值是一个数组
        // },1000);
        // 问题：这样写，会在页面刷新的时候等待1000ms再显示在页面上
        // 解决：在页面刷新的时候直接调用一次。写法如下：
        showTime();
        setInterval(showTime,1000);
        function showTime(){
            var oTime=new Date();
            oP.innerHTML=timeFormat(oTime)[0];
        }
    </script>
</body>
</html>

myjs.js

// 时间格式的封装
function timeFormat(oT){
    var iY=oT.getFullYear();
    var iM=oT.getMonth();
    var iD=oT.getDate();
    var iW=oT.getDay();   //获取的星期是从0-6的数字，需要转换才能使用
    var iH=oT.getHours();
    var iMi=oT.getMinutes();
    var iS=oT.getSeconds();
    var sW="";
    switch(iW){
        case 0 : sW="星期日";break;
        case 1 : sW="星期一";break;
        case 2 : sW="星期二";break;
        case 3 : sW="星期三";break;
        case 4 : sW="星期四";break;
        case 5 : sW="星期五";break;
        case 6 : sW="星期六";break;
    }
    //返回一个数组，第一项是时、分、秒；第二项是年、月、日；第三项的完整的
    return [addZ(iH)+":"+addZ(iMi)+":"+addZ(iS),iY+"/"+(iM+1)+"/"+iD,iY+"/"+(iM+1)+"/"+iD+" "+sW+" "+addZ(iH)+":"+addZ(iMi)+":"+addZ(iS)];
}
function addZ(n){//为了实现一位数字前面加0的功能。eg：09:01
    return n<10 ? "0"+n : ""+n;
}
奋斗中的切图猿
关注
  • 2
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
案例：写一个封装函数返回当前的 时分秒
Sea_water778的博客
10-12 376
function getTime(){ var time = new Date(); var h = time.getHours(); h = h < 10 ? '0' + h : h; var m = time.getMinutes(); m = m < 10 ? '0' + m : m var s = time.getSeconds(); s = s < 10 ? '0' + s : s return h + ':' + m + ':' + s; .
C语言获取当前时间封装函数.rar-综合文档
05-11
然而，如果我们想要封装一个函数来获取当前时间，可以创建一个自定义的函数，比如`get_current_time()`。以下是一个简单的封装示例： ```c #include #include #include char* get_current_time(char* buffer, ...
封装时间函数
http://xueshuai.top
11-13 372
引入GitHub地址： <script src="https://raw.githack.com/xue-shuai/Date.js/master/Date.js"></script> 调用方法afterMin(date,min,format) 参数介绍： 　　date：给定的时间字符串，格式如：2019年11月13日11点20:20 中间只要没有标点或者空...
实用函数封装——返回当前时间时分秒
qq_40937541的博客
02-12 603
function getTime() { var time = new Date() // 获得小时 var h = time.getHours() // 小于10数字前添加’0‘ h = h < 10 ? '0' + h : h var m = time.getMinutes() m = m < 10 ? '0' + m : m var s = time.getSeconds() s = s < 10 ? '0' + s : s return h + ':' + m
封装一个函数，获得系统当前yyyy年mm月dd日星期x格式的时间
sunbeibei00000的博客
05-05 803
封装一个函数，获得系统当前yyyy年mm月dd日星期x格式的时间 今天是 2020年05月05日星期二 function myDate(){ var date = new Date() var year = date.getFullYear() var month = date.getMonth() + 1 month = month < ...
函数封装当前时间
ELing_Lonely的博客
04-20 206
正常的时间格式前言2021-12-21 00：00：00 格式的时间封装总结 前言 我们在写时间的时候会发现时间格式和生活中的不太一样 因此就要自己封装了，接下来展示 提示：以下是本篇文章正文内容，下面可供参考 2021-12-21 00：00：00 格式的时间封装 function Dtime(){ let dTime= new Date() let yea=dTime.getFullYear(); let mon=dTime.getMonth()+1;
javascript实现实时输出当前的时间
10-24
在网页中实时的显示时间，不但可以给网页添色，还可以方便浏览者掌握当前时间，为了提高网站的开发速度，可以把主代码封装在一个单独的函数里面，在需要的时候直接调用而我为了演示，直接写在了主页面，方便大家观看
JavaScript变速动画函数封装添加任意多个属性
10-17
JavaScript变速动画函数封装的核心在于平滑地改变一个或多个CSS属性值，以达到动画效果。在给定的示例中，我们看到一个简单的JavaScript函数`animate`被用来实现这一功能。这个函数接受两个参数，一个是需要操作的...
在页面中输出当前客户端时间javascript实例代码_.docx
10-09
在页面中输出当前客户端时间javascript实例代码 在上述文件中，我们可以看到几点重要的知识点： 首先，我们可以看到在 JavaScript 中使用 `new Date()` 来获取当前客户端时间。这个对象提供了一些有用的方法来获取...
PHP实现记录代码运行时间封装类实例教程
12-09
- `addCost($key)`：标记开始时间，传入一个`$key`（通常为字符串，用于标识代码段），并将当前时间戳保存在`$cost`数组中。 - `closeCost($key)`：标记结束时间，计算从`addCost()`到`closeCost()`之间的执行时间...
封装日期函数
m0_60979337的博客
12-12 215
【代码】1.封装日期函数 2.网页显示日期
JS 封装一个显示时间的函数
weixin_30455365的博客
04-12 348
s(); function s (){ var mydate=new Date(); var y = mydate.getFullYear(); var m = mydate.getMonth(); var d = mydate.getDate(); var x = mydate.getHour...
JS封装返回固定时间函数
qq_40646986的博客
09-29 557
暴露封装 export function formaDate (date, fmt) { //返回固定的年份 if (/(y+)/.test(fmt)) { fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length)) }; //定...
php封装函数输出,php 开发常用的封装函数
weixin_42161497的博客
03-10 88
/************************************************************************ 返回多条数据记录* $sql SQL语句***********************************************************************/function getdata($sql){$result=mys...
封装函数，打印当前是何年何月何日何时何分何秒
qq_37635519的博客
05-16 542
var retMyDate=function(){ var date=new Date() var year=date.getFullYear(); var month=date.getMonth()+1; var day=date.getDate(); var hour=date.getHours() var Mi=dat...
js自定义格式时间输出当前时间,封装时间函数
Cupid
05-08 174
自定义格式时间输出当前时间 <script> function createZero(n){ if(n<10){ return "0"+n; } return n; } var d=new Date; //封装函数，为了方便后期各个格式输出 ...
【小分享】Date对象封装，时间格式化函数time()
diancao3952的博客
02-13 201
今天再来分享下Date的应用知识点 先看效果，类似于php里边的time('yyyy-mm-dd')用法，但是我这里没有完全依照php的参数格式来，如果有需要稍微修改一下就行。 首先，明确需要用到的参数： 1、时间戳，就是你需要格式化的时间戳； 2、格式字符串，类似于“yy-mm-dd”; 具体做法无非就是获取到“年、月、日、时、分、秒、星期”，然后做一...
格式化后的指定格式的日期和时间---封装一个函数
冠日的个人博客
05-30 351
* 获取指定格式的时间 * @param dt 日期的对象 * @returns {string} 返回的是字符串的日期时间 */ function getDate(dt) { //获取年 var year = dt.getFullYear(); //获取月 var month = dt.getMonth() + 1; //获取日 var day = dt.getDate();...
ts封装时间格式化函数
最新发布
05-10
以下是一个简单的 TypeScript 时间格式化函数的封装示例： ```typescript function formatDate(date: Date, format: string): string { ...这将输出当前日期和时间的格式化字符串，例如 `2022-01-01 12:34:56`。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值