Date的基本使用

内置对象Date是构造函数,用new创建对象,无参数时返回当前时间,可加参数返回特定时间

//内置对象Date是构造函数,用new创建对象,无参数时返回当前时间,可加参数返回特定时间
var now_time = new Date();
console.log(now_time);
// 年月日之间可以用-或者/
var time_1 = new Date('2018-05-06 12:36:15');
var time_2 = new Date('2018/05/06');
console.log(time_1);
console.log(time_2);

在这里插入图片描述

格式化时间

可以从上图看到返回的时间格式 Sun May 06 2018 00:00:00 GMT 0800 (中国标准时间) 不符合我们中国人的表示习惯
所以我们需要获取日期的指定部分,然后进行日期格式化。

方法名 说明 代码
getFullYear() 获取当年 Obj.getFullYear()
getMonth() 获取当月,返回0 -11 Obj.getMonth()
getDate() 获取当天日期 Obj.getDate()
getDay() 获取星期几(周日0 到 周六6) Obj.getDay()
getHours() 获取当前小时 Obj.getHours()
getMinutes() 获取当前分钟 Obj.getMinutes()
getSeconds() 获取当前秒钟 Obj.getSeconds()

1.格式化日期 - 年,月,日

//格式化日期- 年,月,日
var date = new Date(); // 实例化一个日期对象
var year = date.getFullYear();  // 返回当前日期年份
var month = date.getMonth()   1;  //返回的是0-11,分别对应1-12月,所以接果 1才是正确的月数
year = year < 10? '0'   year: year ;
var dates = date.getDate();    // 返回几号
dates  = dates < 10? '0'   dates: dates ;
var day = date.getDay();   //返回的是0-6,分别对应星期天-星期六
var day_arr = ['星期天','星期一','星期二','星期三','星期四','星期五','星期六',]
console.log('今天是:'  year   '年'   month    '月'   dates   '日'   day_arr[day]);

在这里插入图片描述

2.格式化时,分,秒

	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 ;
        }
        console.log(getTime());

在这里插入图片描述

获取Date总的毫秒数(时间戳)

我们时常可以看到时间戳,那么他是怎么来的呢?

其实时间戳表示的是从1970年1月1号到当前时间的总的毫秒数。

至于为什么是1970年的这个时间,感兴趣的可以百度看看,十分有趣。

在我们javascript中获取时间戳有三种方法。

//获取Date总的毫秒数(时间戳) ,是从1970年1月1号到当前的总的毫秒数 至于为什么是这个时间,感兴趣的可以百度看看,十分有趣
//1.通过 valueOf() 或者 getTime() 方法
var date = new Date();
console.log(date.valueOf());  //得到的是我们当前时间距离1970 1.1的总的毫秒数
console.log(date.getTime());
//2.简单的写法(最常用的写法)
var date =  new Date(); 
console.log(date);
//3.H5 新增的,ie9以下不适用
console.log(Date.now());

在这里插入图片描述

案例-网页倒计时核心算法(重要)

1)核心算法:输入的时间减去现在的时问就是利余的时问,即倒计时,但是不能拿着时分秒相减,比如05分减去25分,结果会是负数的。

2)用时间载来做。用户输入时间总的老秒数减去现在时间的总的毫秒数,得到的就是剩余时间的毫秒数。

3)把剩余时间总的毫秒数化为秒然后转换为天、时、分、秒(时间转换为时分秒)

转换公式下:

d = parselnt (总秒数/60/60/24);        计算天数
h = parselnt (总秒数/60/60$);        计算小时
m = parselnt (总秒数/60`);        计算分数
s = parselnt (总秒数%60);        计算当前秒数

//网页倒计时核心算法
function countTime(time){
    var newTime =  new Date(); //获取当前总的毫秒数(时间戳)
    var inputTime =  new Date(time); // 得到指定时间的时间戳
    var times = (inputTime - newTime) / 1000; // 剩余时间的秒数
    var d = parseInt(times / 60 / 60 / 24); // 天数 ,取整
    d = d<10 ? '0' d : d; // 补零
    var h = parseInt(times / 60 / 60 % 24);  // 时
    h = h<10 ? '0' h : h;
    var m = parseInt(times / 60 % 60); //分
    m = m<10 ? '0' m : m;
    var s = parseInt(times % 60);  //秒
    s = s<10 ? '0' s : s;
    return d   '天'   h   '时'   m   '分'   s   '秒';
}
    console.log(countTime('2022-03-01 18:00:00'));

在这里插入图片描述

结语

以上就是javascript内置对象Date案例总结分析的详细内容,更多关于javascript内置对象Date的资料请关注Devmax其它相关文章!

javascript内置对象Date案例总结分析的更多相关文章

  1. 基于JavaScript编写一个图片转PDF转换器

    本文为大家介绍了一个简单的 JavaScript 项目,可以将图片转换为 PDF 文件。你可以从本地选择任何一张图片,只需点击一下即可将其转换为 PDF 文件,感兴趣的可以动手尝试一下

  2. HTML5数字输入仅接受整数的实现代码

    这篇文章主要介绍了HTML5数字输入仅接受整数的实现代码,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  3. amaze ui 的使用详细教程

    这篇文章主要介绍了amaze ui 的使用详细教程,本文通过多种方法给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  4. html5简介_动力节点Java学院整理

    这篇文章主要介绍了html5简介,用于指定构建网页的元素,这些元素中的大多数都用于描述网页内容,有兴趣的可以了解一下

  5. ios 8 Homescreen webapp,关闭和打开iPad停止javascript

    我有一个适用于iPad的全屏HTML5网络应用程序,并且刚刚安装了IOS8来试用它,它一切正常,直到你关闭并重新启动iPad.一旦web应用程序重新启动javascript就会停止并加载新页面不会重新启动它.在iPad上的Safari中打开同一页面时,关闭和打开iPad会继续按预期工作.其他人注意到了这个或想出了一个解决方案吗?解决方法这似乎是我在iOS8.1.1更新中解决的.

  6. 对于NSManagedObject,Xcode 9构建了Date vs NSDate的问题

    Xcode9为模拟器与设备中的实体的Date类型属性生成不同的代码.我在coredata中将类设置为类别/扩展名下的codegen功能.直到Xcode8.3(最新)它一切正常.下面是Xcode9为属性自动生成的代码–在设备上:–和,在模拟器上:–有谁遇到过这个问题?对于一个有50个成员的项目来解决这个问题的最佳解决方案是什么,直到Xcode更新修复它?

  7. iOS兼容输入类型日期 – 设置最小值最大值

    我试图在UIWebViewiOS应用程序中使用jQueryMobile设置日期,值设置正确但最小和最大属性日期设置不起作用.和当我在模拟器上运行它时,当选择日期字段时,日期选择器可见,但未设置最小,最大日期.解决方法模拟器的safari不支持设置输入类型=“日期”的最小值和最大值.您可以通过导航到thissite并尝试控制来测试它.它(可能)可以在桌面浏览器上运行,但不会在模拟器的浏览器或UIWebView中运行.

  8. iOS 6 javascript与object.defineProperty的间歇性问题

    当访问使用较新的Object.defineProperty语法定义属性的对象的属性时,有没有其他人注意到新iOS6javascript引擎中的间歇性错误/问题?https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Object/defineProperty我正在看到javascript失败的情况,说

  9. ios – 设置NSDataDetector的上下文日期

    假设今天是2014年1月20日.如果我使用NSDataDetector从“明天下午4点”字符串中提取日期,我将得到2014-01-21T16:00.大.但是,假设我希望NSDataDetector假装当前日期是2014年1月14日.这样,当我解析“明天下午4点”时,我将得到2014-01-15T16:00.如果我在设备上更改系统时间,我会得到我想要的.但是,有没有办法以编程方式指定它?

  10. ios – 如何使用JSExport导出内部类的方法

    解决方法似乎没有办法将内部类函数导出到javascript.我将内部类移出并创建了独立的类,它起作用了.

随机推荐

  1. js中‘!.’是什么意思

  2. Vue如何指定不编译的文件夹和favicon.ico

    这篇文章主要介绍了Vue如何指定不编译的文件夹和favicon.ico,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  3. 基于JavaScript编写一个图片转PDF转换器

    本文为大家介绍了一个简单的 JavaScript 项目,可以将图片转换为 PDF 文件。你可以从本地选择任何一张图片,只需点击一下即可将其转换为 PDF 文件,感兴趣的可以动手尝试一下

  4. jquery点赞功能实现代码 点个赞吧!

    点赞功能很多地方都会出现,如何实现爱心点赞功能,这篇文章主要为大家详细介绍了jquery点赞功能实现代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  5. AngularJs上传前预览图片的实例代码

    使用AngularJs进行开发,在项目中,经常会遇到上传图片后,需在一旁预览图片内容,怎么实现这样的功能呢?今天小编给大家分享AugularJs上传前预览图片的实现代码,需要的朋友参考下吧

  6. JavaScript面向对象编程入门教程

    这篇文章主要介绍了JavaScript面向对象编程的相关概念,例如类、对象、属性、方法等面向对象的术语,并以实例讲解各种术语的使用,非常好的一篇面向对象入门教程,其它语言也可以参考哦

  7. jQuery中的通配符选择器使用总结

    通配符在控制input标签时相当好用,这里简单进行了jQuery中的通配符选择器使用总结,需要的朋友可以参考下

  8. javascript 动态调整图片尺寸实现代码

    在自己的网站上更新文章时一个比较常见的问题是:文章插图太宽,使整个网页都变形了。如果对每个插图都先进行缩放再插入的话,太麻烦了。

  9. jquery ajaxfileupload异步上传插件

    这篇文章主要为大家详细介绍了jquery ajaxfileupload异步上传插件,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  10. React学习之受控组件与数据共享实例分析

    这篇文章主要介绍了React学习之受控组件与数据共享,结合实例形式分析了React受控组件与组件间数据共享相关原理与使用技巧,需要的朋友可以参考下

返回
顶部