基本概念
我们先来介绍一些可能当年在地理课上学习过的基本概念。
说起来,时间真是一个神奇的东西。以前人们通过观察太阳的位置来决定时间(比如:使用日晷),这就使得不同经纬度的地区时间是不一样的。后来人们进一步规定以子午线为中心,向东西两侧延伸,每 15 度划分一个时区,刚好是 24 个时区。然后因为一天有 24 小时,地球自转一圈是 360 度,360 度 / 24 小时 = 15 度/小时,所以每差一个时区,时间就差一个小时。
最开始的标准时间(子午线中心处的时间)是英国伦敦的皇家格林威治天文台的标准时间(因为它刚好在本初子午线经过的地方),这就是我们常说的 GMT(Greenwich Mean Time)。然后其他各个时区根据标准时间确定自己的时间,往东的时区时间晚(表示为 GMT+hh:mm)、往西的时区时间早(表示为 GMT-hh:mm)。比如,中国标准时间是东八区,我们的时间就总是比 GMT 时间晚 8 小时,他们在凌晨 1 点,我们已经是早晨 9 点了。
但是 GMT 其实是根据地球自转、公转计算的(太阳每天经过英国伦敦皇家格林威治天文台的时间为中午 12 点),不是非常准确,于是后面提出了根据原子钟计算的标准时间 UTC(Coordinated Universal Time)。
一般情况下,GMT 和 UTC 可以互换,但是实际上,GMT 是一个时区,而 UTC 是一个时间标准。
可以在这里看到所有的时区:http://www.timeanddate.com/time/map/
所以,当我们“展示”某个时间时,明确时区就变得非常重要了。不然你只说现在是 2016-01-11 19:30:00,然后不告诉我时区,我其实是没法准确知道时间的(当然,我可以认为这个时间是我所在时区的当地时间)。如果你说现在是 2016-01-11 19:30:00 GMT+0800,那我就知道这个时间是东八区的时间了。如果我在东八区,那时间就是 19:30,如果我在 GMT 时区,那时间就是 11:30(减掉 8 小时)。
//全球时区倒计时:需求:全球看到的倒计时都相同
var date = new Date();
// 当前时间
var y = date.getUTCFullYear();
var m = date.getUTCMonth();
var d = date.getUTCDate();
var h = date.getUTCHours();
var m = date.getUTCMinutes();
var s = date.getUTCSeconds();
var UTCDate = new Date(y,m,d,h,m,s);
//当前时间 + 0800 变为当前北京时区时间 或者 直接把活动时间转换为UTC时间更好
// UTC的活动时间 - UTC的当前时间 = 倒计时时间
//在计算倒计时的时候需要知道活动给定时间的时区(活动地区的时间),然后根据时区换算为UTC时间
/**
* 1.根据时区将活动时间换算为UTC时间(需要知道各个时区的时间差)
* 2.UTC的活动时间 - UTC的当前时间 = 倒计时时间
* 3.所以最好的方法就是服务器给值,服务器的结束时间 - 服务器的当前时间,全球看到的时间就相同了
*/
function countDown(eleId) {
}
//根据不同时区返回UTC时间 当减少时区的时候还牵涉到年月日时分秒的换算 所以最好的是换算成毫秒,减去不同时区的差值,然后再转换回当前时间 转换成正确的时间
switch (key) {
case value:
break;
default:
break;
}
//假设默认结束时间(endTime)已经换算为O时区的事件(UTC)
if (element) {
var endTimer = element.attr('date-timer');
var endTime = new Date(parseInt(endTimer.substr(0, 4), 10),
parseInt(endTimer.substr(4, 2), 10),
parseInt(endTimer.substr(6, 2), 10),
parseInt(endTimer.substr(8, 2), 10),
parseInt(endTimer.substr(10, 2), 10),
parseInt(endTimer.substr(12, 2), 10)
)
var endTimMonth = endTime.getMonth() - 1;//延伸:在进行月份切换的时候,new Date的时间为5月31时,转化出来的日期为7月1日,减掉一个月份之后为6月1号,无法获得正确的5月31日,原因为6月没有31号,所以加了一个月,到了7月份,所以就产生了错误.所以一般不要在new Date()之后再转化月份,而要在new Date()之前先把月份减1.
var endTime = new Date(parseInt(endTimer.substr(0, 4), 10),
parseInt(endTimer.substr(4, 2) - 1, 10), //最好改成这样,以防出错
parseInt(endTimer.substr(6, 2), 10),
parseInt(endTimer.substr(8, 2), 10),
parseInt(endTimer.substr(10, 2), 10),
parseInt(endTimer.substr(12, 2), 10)
)
//也可以先把日期置为1,再调整月份,年份最后获得,以防止月份进位。
//解决办法
var myDate=new Date()
myDate.setFullYear(2008,7,9)
//注意:表示月份的参数介于 0 到 11 之间。也就是说,如果希望把月设置为 8 月,则参数应该是 7。
//UTC时间
var y = date.getUTCFullYear();
var m = date.getUTCMonth();
var d = date.getUTCDate();
var h = date.getUTCHours();
var m = date.getUTCMinutes();
var s = date.getUTCSeconds();
endTime.setMonth(endTimMonth);
var nowTime = new Date();
var ts = endTime - new Date(y,m,d,h,m,s);
if (ts > 0) {
var dd = parseInt(ts / 1000 / 60 / 60 / 24, 10);
var hh = parseInt(ts / 1000 / 60 / 60 % 24, 10);
var mm = parseInt(ts / 1000 / 60 % 60, 10);
var ss = parseInt(ts / 1000 % 60, 10);
dd = dd < 10 ? ('0' + dd) : dd;
hh = hh < 10 ? ('0' + hh) : hh;
mm = mm < 10 ? ('0' + mm) : mm;
ss = ss < 10 ? ('0' + ss) : ss;
$timer_d.text(dd);
$timer_h.text(hh);
$timer_m.text(mm);
$timer_s.text(ss);
setTimeout(function () {
landingpage.countdown(eleId);
}, 1000);
} else {
$timer_d.text('00');
$timer_h.text('00');
$timer_m.text('00');
$timer_s.text('00');
}
}
http://www.w3school.com.cn/js/jsref_getTimezoneOffset.asp
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/getUTCDate
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Date
http://xtutu.me/the-date-object-in-js/
例子:创建一个日期对象的几种方法
下例展示了用来创建一个日期对象的多种方法。
var today = new Date();
var today = new Date(1453094034000);// by timestamp(accurate to the millimeter)
var birthday = new Date("December 17, 1995 03:24:00");
var birthday = new Date("1995-12-17T03:24:00");
var birthday = new Date(1995,11,17);
var birthday = new Date(1995,11,17,3,24,0);
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Date
Note: 当Date作为构造函数调用并传入多个参数时,如果数值大于合理范围时(如月份为13或者分钟数为70),相邻的数值会被调整。比如 new Date(2013, 13, 1)等于new Date(2014, 1, 1),它们都表示日期2014-02-01(注意月份是从0开始的)。其他数值也是类似,new Date(2013, 2, 1, 0, 70)等于new Date(2013, 2, 1, 1, 10),都表示时间2013-03-01T01:10:00。所以当你输入的日期为Date(2013, 5, 31)时,相当于2013-06-31,但6月没有31日所以变为2013-07-01,所以,为了避免出错,还是在换算之前提前把月份减1吧
延伸:
value
代表自1970年1月1日00:00:00 (世界标准时间) 起经过的毫秒数。
dateString
表示日期的字符串值。该字符串应该能被 Date.parse() 方法识别(符合 IETF-compliant RFC 2822 timestamps 或 version of ISO8601)。
year
代表年份的整数值。为了避免2000年问题最好指定4位数的年份; 使用 1998, 而不要用 98.
month
代表月份的整数值从0(1月)到11(12月)。
day
代表一个月中的第几天的整数值,从1开始。
hour
代表一天中的小时数的整数值 (24小时制)。
minute
分钟数。
second
秒数。
millisecond
表示时间的毫秒部分的整数值。
i18n:国际化
浏览器获取当前用户所在的时区等信息只和系统的日期和时间设置里的时区及时间有关。区域和语言设置影响的是浏览器默认时间函数(Date.prototype.toLocaleString等)显示的格式,不会对时区等有影响。Date有个Date.prototype.toLocaleString()方法可以将时间字符串返回用户本地字符串格式,这个方法还有两个子方法Date.prototype.toLocaleDateString和Date.prototype.toLocaleTimeString,这两个方法返回值分别表示日期和时间,加一起就是Date.prototype.toLocaleString的结果。这个方法的默认参数会对时间字符串做一次转换,将其转换成用户当前所在时区的时间,并按照对应的系统设置时间格式返回字符串结果。然而不同浏览器对用户本地所使用的语言格式的判断依据是不同的。
IE:获取系统当前的区域和语言-格式中设置的格式,依照其对应的格式来显示当前时间结果;IE浏览器实时查询该系统设置(即你在浏览器窗口打开后去更改系统设置也会引起返回格式变化)。假设系统语言为 ja-JP,系统unicode语言为zh-CN日期格式为nl-NL,浏览器语言设置(accept-language)为de,浏览器界面语言为en-US(其他条件不变,浏览器界面语言改为zh-CN的时候结果也是一样),
window.navigator.language
//"nl-NL"
window.navigator.systemLanguage
//"zh-CN"(设置中的非unicode程序所使用语言选项)
window.navigator.userLanguage
//"nl-NL"
window.navigator.browserLanguage
//"ja-JP"(系统菜单界面语言)
window.navigator.languages
//undefined
FF:获取方式和结果与IE浏览器相同,区别在于FF只会在浏览器进程第一次启动的时候获取一次系统设置,中间不管怎么系统设置怎么变化,FF都无法获取到当前系统设置。除非重启FF浏览器。当浏览器界面语言为zh-CN,accept-language首位为en-US的时候:
window.navigator.language
//'en-US'
window.navigator.languages
//["en-US", "zh-CN", "de", "zh", "en"]
//当界面语言改为"en-US",`accept-language`首位为`zh-CN`的时候
window.navigator.language
//'zh-CN'(`accept-language`首选值)
window.navigator.languages
//["zh-CN", "de", "zh", "en-US", "en"]
Chrome:获取方式和以上两个都不同。chrome无视系统的区域和语言-格式格式,只依照自己浏览器的界面设置的菜单语言来处理。(比如英文界面则按系统’en-US’格式返回字符串,中文界面则按系统’zh-CN’格式返回结果)。当浏览器界面语言为zh-CN,accept-language首位为en-US的时候:
window.navigator.language
//'zh-CN'
window.navigator.languages
//["en-US", "en", "zh-CN", "zh", "ja", "zh-TW", "de-LI", "de", "pl"]
//当界面语言改为"en-US"时
window.navigator.language
//'en-US'(浏览器界面语言)
相关链接:https://segmentfault.com/q/1010000005606125
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Date
http://chitanda.me/2015/08/21/the-trivia-of-js-date-function/
重要
https://segmentfault.com/a/1190000004292140
https://segmentfault.com/a/1190000007581722
0 个评论
要回复文章请先登录或注册