JS中的日期和时间详解

news/2024/7/19 15:04:03 标签: js, date

JS中的日期和时间详解

  • 关于Date()构造函数
  • 简单实例
  • 用Date()构造函数创建时钟

关于Date()构造函数

Date()构造函数是javascript的核心语言部分,用来创建表示时间和日期的对象。这些日期对象的方法为日期计算提供了简单的API。日期对象不是数字那样的基本类型。

简单实例

下面列举几个简单的实例来认识一下我们的这位新朋友:

  1. var then = new Date(2019, 2 ,2); //2019年3月2日
  2. var later = new Date(2019, 2 ,2, 17, 22, 24); //2019年3月2日5:22:24pm
  3. var now = new Date(); //当前日期和时间
  4. var elapsed = now - then; //日期减法:计算时间间隔的毫秒数
  5. later.getFullYear() //=>2019
  6. later.getMonth() //=>2:从0开始计数的月份
  7. later.getDate() //=>2:从1开始计数的天数
  8. later.getDay() //=>5:获取星期几,0代表星期日,1到6分别对应星期一到星期六
  9. later.getHours() //=>17:获取小时数
  10. later.getMinutes() //=>22:获取分钟数
  11. later.getSeconds() //=>24:获取秒数

上边的几个实际应用体现出了我们的时间构造函数的强大之处,接下来我们就写一个简单的小功能,来实际演练一下。

用Date()构造函数创建时钟

<div id="clock"></div>
    <script>
        //创建时间函数;
        !(function clock(){
            var now = new Date();
            var Y = now.getFullYear();
            var m = getRealTime(now.getMonth()+1);
            var d = getRealTime(now.getDate());
            var H = getRealTime(now.getHours());
            var i = getRealTime(now.getMinutes());
            var s = getRealTime(now.getSeconds());
            var now_time = Y +'-'+ m +'-'+ d +' '+ H +':'+ i +':'+ s;
            document.getElementById('clock').innerHTML = now_time;

            //一秒钟运行一次时间函数
            setTimeout(clock,1000);
        })();

        //时间处理函数;
        function getRealTime(str){
            if(str < 10){
                return '0'+str;
            }
            return str;
        }
    </script>

这样我们就创建了一个简单的时间计数器,还有更多好玩的功能,大家可以在实际生产中慢慢摸索,体验js的魅力。


http://www.niftyadmin.cn/n/736694.html

相关文章

减少媒体查询的技巧-1

在设计和制作自适应网页的时候&#xff0c;我们经常会用到媒体查询这一功能&#xff0c;可是过多的使用这个功能会增加我们的代码量&#xff0c;增加了我们的维护成本&#xff0c;下面我们来一起看一下这几个技巧&#xff0c;或许可以帮助你减少媒体查询的使用。 1.使用百分比…

CSS中的 inline-block 导致换行问题

最近在写导航的时候&#xff0c;使用了inline-block&#xff0c;之前的都是用float写&#xff0c;没有遇到今天的换行问题&#xff0c;打开调试模式&#xff0c;查看padding和margin均为0&#xff0c;也就是说&#xff0c;问题并不是出现在换行元素本身上边&#xff0c;于是查找…

PHP 常用的header头部定义汇总

PHP的头部信息整理一下&#xff1a; <?php header(HTTP/1.1 200 OK); // ok 正常访问 header(HTTP/1.1 404 Not Found); //通知浏览器 页面不存在 header(HTTP/1.1 301 Moved Permanently); //设置地址被永久的重定向 301 header(Location: http://www.ithhc.cn/); //跳转…

免费CDN加速服务

CDN也称内容分发网络&#xff0c;其原理大概是将服务内容分发至全网加速节点&#xff0c;让用户从就近的服务器节点上获取内容&#xff0c;从而提高网站的访问速度。大部分服务商&#xff08;如阿里云&#xff0c;网易蜂巢&#xff0c;京东云等&#xff09;的CDN服务是按使用量…

关于SEO你需要知道哪些东西?

seo指的是搜索引擎优化。是一种利用搜索引擎的规则提高网站在有关搜索引擎内的自然排名的手段。目的是让其在行业内占据领先地位&#xff0c;获得品牌收益。很大程度上是网站经营者的一种商业行为&#xff0c;将自己或自己公司的排名前移。 概述 网站搜索引擎优化任务主要是认…

cnpm - 解决 cnpm : 无法加载文件 C:\Users\93457\AppData\Roaming\npm\cnpm.ps1,因为在此系统上禁止运行脚本...

1.在win10 系统中搜索框 输入 Windos PowerShell 选择 管理员身份运行 2&#xff0c;打开了powershell命令行之后,输入 set-ExecutionPolicy RemoteSigned 然后更改权限为A 最后通过 get-ExecutionPolicy 查看当前的状态 完成。

关于织梦无法更新栏目页和内容页的问题

1.如果是安装的织梦&#xff0c;一般不存在其他问题&#xff0c;就是本身模板的问题&#xff0c;好好检查一下&#xff0c;分段排查列表页的模板&#xff0c;一定会找到问题的。 2.百度到的答案&#xff1a; 1.找到根目录下/data/tplcache文件夹&#xff0c;并删除文件夹内所有…

hibernate jar包介绍

一直使用my eclipse集成的Hibernate来学习。最近在写hibernate的日记&#xff0c;写到搭建hibernate框架的时候才发现自己对hibernate的内容还是不了解&#xff0c;决定自己手动搭建一下。这就牵出了一个问题&#xff1a;添加jar包的时候&#xff0c;到底应该选哪个呢&#xff…