-->获取与设置时间的方法
-->使用Date对象制作相应的效果

1、设置时间
创建一个时间对象

new Date(time);

设置时间 time

从1970年1月1日至
几种格式:
new Date("May 25 , 2024");
new Date("2015/12/25,12:20:12");
new Date(2016,1,1); 2016年2月1日零点

 <script>
/*创建一个时间对象*/
var Now=new Date();
console.log(Now);//Tue Sep 06 2016 14:47:44 GMT+0800 (中国标准时间-->CST)
/*设置时间*/
var date1=new Date('May 25,2024');//5月 24日 2014年
console.log(date1);//Sat May 25 2024 00:00:00 GMT+0800 (中国标准时间)
var date2=new Date("2016/10/01,10:10:11");//年月日,时分秒
console.log(date2);//Sat Oct 01 2016 10:10:11 GMT+0800 (中国标准时间)
var date3=new Date(2016,10,1,10,10,11,111);//年,月(10代表11月),日,时,分,秒,
console.log(date3);//Tue Nov 01 2016 10:10:11 GMT+0800 (中国标准时间)
//
</script>

2、获取当前时区的时间

时间包括了多个信息,如何获取到其中的某一个信息呢?

--获取当前时间的方法

getFullYear(); 获取4位数的年份
getMonth(); 获取月份,从0~11,0表示1月,7表示8月
getDate(); 获取月份中的天数(日期)
getDay(); 获取星期几,0为星期日,6为星期六

getHours( ) 获取当前小时数
getMinutes( ) 获取当前分钟数
getSeconds( ) 获取当前秒数
getMilliseconds(); 获取当前的毫秒数
getTime(); 获取从1970年1月1日08:00:00到现在的毫秒数

--获取时间的方法代码:

<script>
/*获取时间的方法(Date对象没有属性)*/
var now=new Date();
console.log(now);//Sat Sep 10 2016 20:58:13 GMT+0800 (中国标准时间)
console.log(now.getFullYear());//
console.log(typeof now.getFullYear());//number
console.log(now.getMonth());//月-8-->9
console.log(now.getDate());//日-6
console.log(now.getDay());//星期-2
console.log(now.getHours());//时-20
console.log(now.getMinutes());//分-58
console.log(now.getSeconds());//秒-13
console.log(now.getMilliseconds());//毫秒(0~999)
console.log(now.getTime());//
</script>

3、设置当前时区的时间

setFullYear(); 设置4位数的年份
setMonth(); 设置月份,从0开始,0表示1月
setDate(); 设置月份中的天数
setHours(); 设置当前的小时数,0-23
setMinutes(); 设置当前的分钟数,0-59
setSeconds(); 设置当前的秒数,0-59
setMilliseconds(); 设置当前的毫秒数
setTime(); 向1970/1/1 添加毫秒数

<script>
var con=document.getElementById('con');
var now=new Date();
console.log(now);//Tue Sep 06 2016 16:36:40 GMT+0800 (中国标准时间)
now.setFullYear(2017);
console.log(now);//Wed Sep 06 2017 16:37:05
now.setMonth(6);
console.log(now);//Thu Jul 06 2017 16:38:30
now.setTime(1000*60*60);//1970年1月1号早上8点添加毫秒数
console.log(now);//Thu Jan 01 1970 09:00:00
var date1=new Date(1000*60*60);//当前时间+设置毫秒数
console.log(date1);//Thu Jan 01 1970 09:00:00
</script>

4、UTC时间

UTC国际标准时间又称世界时间
以零经度线上的时间作为国际上统一采用的标准时间。因为零经度线通过英国格林尼治天文台,所以国际标准时间也称为格林尼治时间GMT。

当前北京时间=国际标准时间+8小时

4-1、获取UTC时区的时间

getUTCFullYear(); 获取UTC日期的4位数年份
getUTCMonth(); 获取UTC日期月份,从0开始
getUTCDate(); 获取UTC日期月份中的天数
getUTCDay(); 获取UTC日期的周几,从0开始
getUTCHours(); 获取UTC日期的小时数,0-23
getUTCMinutes(); 获取UTC日期的分钟数,0-59
getUTCSeconds(); 获取UTC日期的秒数,0-59
getUTCMilliseconds(); 获取UTC日期的毫秒数

4-2、设置UTC时区的时间

setUTCFullYear();设置UTC日期的4位数年份
setUTCMonth();设置UTC日期月份,从0开始
setUTCDate();设置UTC日期月份中的天数
setUTCHours();设置UTC日期的小时数,0-23
setUTCMinutes();设置UTC日期的分钟数,0-59
setUTCSeconds();设置UTC日期的秒数,0-59
setUTCMilliseconds();设置UTC日期的毫秒数

5、获取当前时间效果

 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>获取当前时间</title>
<style>
*{color:red;}
</style>
</head>
<body>
<h1 id="con"></h1>
<script>
var con=document.getElementById('con');
var timer=null;
timer=setInterval(function(){
var now=new Date();
var year=now.getFullYear();
var month=now.getMonth()+1;
var date=now.getDate();
var house=now.getHours();
var minutes=now.getMinutes();
var second=now.getSeconds();
var millise=now.getMilliseconds();
if(house<10){
house='0'+house;
}
if(minutes<10){
minutes='0'+minutes;
}
if(second<10){
second='0'+second;
}
if(millise<10){
millise='00'+millise;
}else if(millise<100){
millise='0'+millise;
}
con.innerHTML='北京时间:'+year+'年'+month+'月'+date+'号'+house+'时'+minutes+'分'+second+'秒'+millise+'毫秒';
},1)
</script>
</body>
</html>

6、倒计时效果

 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>练习2-倒计时</title>
<style>
*{color:red;}
</style>
</head>
<body>
<h1>距离国庆节放假还剩:<span id="con"></span></h1>
<h1>距离中秋节放假还剩:<span id="con2"></span></h1>
<script>
var con=document.getElementById('con');
var con2=document.getElementById('con2');
var guoq=new Date("2016/10/1,00:00:00");
var zhq=new Date("2016/9/15,00:00:00");
var end=guoq.getTime();
var end2=zhq.getTime();
var timer=null,timer2=null;
timer=setInterval(function(){
var str1='';
var now=new Date();
var start=now.getTime();
var zong=end-start;
var day=parseInt(zong/(1000*60*60*24));//获取商
var _day=zong%(1000*60*60*24);//获取余数
var hour=parseInt(_day/(1000*60*60));
var _hour=_day%(1000*60*60);
var minutes=parseInt(_hour/(1000*60));
var _minutes=_hour%(1000*60);
var seconds=parseInt(_minutes/1000);
var millis=_minutes%1000;
str1=day+'天'+hour+'小时'+minutes+'分钟'+seconds+'秒'+millis+'毫秒'
con.innerHTML=str1;
},1)
timer2=setInterval(function(){
var str1='';
var now=new Date();
var start=now.getTime();
var zong=end2-start;
var day=parseInt(zong/(1000*60*60*24));//获取商
var _day=zong%(1000*60*60*24);//获取余数
var hour=parseInt(_day/(1000*60*60));
var _hour=_day%(1000*60*60);
var minutes=parseInt(_hour/(1000*60));
var _minutes=_hour%(1000*60);
var seconds=parseInt(_minutes/1000);
var millis=_minutes%1000;
str1=day+'天'+hour+'小时'+minutes+'分钟'+seconds+'秒'+millis+'毫秒'
con2.innerHTML=str1;
},1)
</script>
</body>
</html>

好友链接地址有些效果可以看看: https://www.cnblogs.com/duenyang/

[JS]笔记13之Date对象的更多相关文章

  1. #9.6课堂JS总结#变量作用域 date()对象 math()对象

    一.变量的作用域 1.JavaScript的作用域链 首先看下下面这段代码: <script type="text/javascript"> var rain = 1; ...

  2. js匿名函数和date对象,math对象

    匿名函数: <script type="text/javascript"> function (参数列表){ 要执行的语句块; } </script> 对象 ...

  3. JS高程13.3事件对象的学习笔记

    1.事件流 事件流描述的是页面中元素接收事件的顺序.比如你单击了某个按钮,他们都认为单击事件不仅仅发生在按钮上,换句话说,在单击按钮的同时,你也单击了按钮的容器元素,甚至还单击了整个页面.那么你到底是 ...

  4. js - 日期、时间 Date对象方法

    Date 是 JS 内置的日期构造函数 var d = new Date();  // 这个是系统当前时间的日期实例 d.getYear(); // 返回 d 实例年份 - 1900 d.getFul ...

  5. js时间字符串转Date对象

    var DATE_REGEXP = new RegExp("(\\d{4})-(\\d{2})-(\\d{2})([T\\s](\\d{2}):(\\d{2}):(\\d{2})(\\.(\ ...

  6. js笔记13

    1.js操作css样式 div.style.width="100px".在div标签内我们添加了一个style属性,并设定了width值,这种写法会给标签带来大量的style属性, ...

  7. JavaScript -- 时光流逝(五):js中的 Date 对象的方法

    JavaScript -- 知识点回顾篇(五):js中的 Date 对象的方法 Date 对象: 用于处理日期和时间. 1. Date对象的方法 <script type="text/ ...

  8. 廖雪峰js教程笔记8 date对象介绍和处理

    在JavaScript中,Date对象用来表示日期和时间. 要获取系统当前时间,用: var now = new Date(); now; // Wed Jun 24 2015 19:49:22 GM ...

  9. Js笔记(对象,构造函数,原型,原型链,继承)及一些不熟悉的语法

    对象的特性: 1.唯一标识性,即使完全不一样的对象,内存地址也不同,所以他们不相等 2.对象具有状态,同一个对象可能处在不同状态下 3.对象具有行为,即对象的状态可能因为他的行为产生变迁 Js直到es ...

随机推荐

  1. 彻底理解nth-child和nth-of-type的区别。

    最近又有些天没写博客了,主要写一篇下来,太浪费时间了,其实这不是根本,根本是最近比较忙,忙什么呢?最近发现一个问题觉得学习速度太慢了,时间倒是花的很多,但大部分时间都花在无意义的事情上,所有打算改变政 ...

  2. android模仿58筛选下拉框(PopupWindow实现)

    前言:前几天用58同城APP找房子的时候,看到筛选下拉框蛮不错的,然后也有很多朋友需要实现这个功能,于是从网上下载了一个demo,在他的基础上进行修改,花了几个小时对他的代码进行修改,重构,封装.把一 ...

  3. Mobile Web中URL设计问题

    自己虽然也注册了CSDN账号,但是没有在上面发表过博客等内容.不过经常在Google里面搜索相关内容时,会显示csdn的结果.这也说明国内很多IT人员都会在CSDN发表博客,记录解决问题过程或者想法. ...

  4. MySQL学习笔记十一:数据导入与导出

    数据导入 1.mysqlimport命令行导入数据 在使用mysqlimport命令导入数据时,数据来源文件名要和目标表一致,不想改文件名的话,可以复制一份创建临时文件,示例如下. 建立一个文本use ...

  5. jquery EasyUI的formatter格式化函数代码

    要格式化数据表格列,需要设置formatter属性,该属性是一个函数,它包含两个参数:  value: 对应字段的当前列的值  record: 当前行的记录数据  复制代码 代码如下: $('#tt' ...

  6. Android随笔之——按键长按事件onKeyLongPress

    现在安卓手机实体键是越来越少了,但还是有的,恰好自己就碰上了:按键的长按事件...百度了一些博客,内容都基本上是完全一样的,虽然可以捕获到长按事件,但却会和正常的单击冲突.幸好最近开个VPN,goog ...

  7. 不行,受不了了,我要记录下这个 bug

    我们在使用 java 中使用线程 Thread 的时候,在 run(){  } 里面的如果要传递参数给函数,一般,编译系统都会提示我们,要将这个参数尽可能地设置为 final,即常量,一旦定义就不能再 ...

  8. 重温JSP学习笔记--JSP动作标签

    上一篇笔记写的是jsp的三个指令九个内置对象,这篇随笔开始写jsp的动作标签,动作标签是由服务器(Tomcat)来解释执行,与java代码一样,都是在服务器端执行的,jsp动作标签有十几多个,这里只写 ...

  9. SQL之收集SQL Server线程等待信息

    要知道线程等待时间是制约SQL Server效率的重要原因,这一个随笔中将学习怎样收集SQL Server中的线程等待时间,类型等信息,这些信息是进行数据库优化的依据. sys.dm_os_wait_ ...

  10. Hibernate —— HQL、QBC检索方式

    一.HQL 检索方式 以双向的一对多来测试 HQL 检索方式.以 Department 和 Employee 为例. 建表语句: CREATE TABLE department ( dept_id ) ...