更新时间：2020年09月24日 08:32:19 作者：TonyStudio
这篇文章主要介绍了JavaScript获取时区实现过程解析,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
在一个大型的项目中，不可避免会出现操作时间的业务，比如时间的格式化，比如时间的加减，我们一般会直接使用moment.js库来做，毕竟稳定可靠，也方便，那当我们系统只是几个简单页面，对时间的操作并不是很大，引入库文件并不是很必须的情况，我们需要时区展示怎么办？是不是可以用浏览器支持的原生方法来实现？
啥是时区？
时区是地球上的区域使用同一个时间定义。以前，人们通过观察太阳的外置（时角）决定时间，这就使得不同经度的地方的时间各有不同，为了统一使用同一个时间，就引入了时区的概念。时区通过设立一个标准时间部分地解决了这个问题。世界各国位于地球的不同位置，因此不同国家，特别是东西跨度大的国家日出、日落时间必定有偏差，这些偏差就是时差。
时区表示法
协调世界时（UTC）是最主要的世界时间标准，其以院子时秒长为基础，在时刻上尽量接近于格林威治标准时间。协调世界时是世界上调调节时钟和时间的主要标准。如果时间是以协调世界时（UTC）表示，则在时间后面加上“Z”，“Z”是协调世界时中0时区的标志。UTC时间也叫祖鲁时间，因为在北约音标字母中用“Zulu”表示“Z”。
UTC偏移量的表示形式为：±[hh]:[mm]、±[hh][mm]或者±[hh]。比如北京时间比协调世界时（UTC）早八小时，那么应当表示为：UTC+8。
JavaScript获得当前客户端的时区
Intl对象是ECMAScript国际化API的一个命名空间，它提供了精确的字符串对比、数字格式化和日期格式化。我们需要使用这个API的DateTimeFormat对象。具体可以参考：MDN Intl.DateTimeFormat
获得客户端当前时区：
Intl.DateTimeFormat().resolvedOptions().timeZone
可以看到输出：Asia/Shanghai，即我所在时区为上海。
我们知道了在哪个时区，但是我们需要同时表示UTC+n的形式，那我们怎么知道当前时区的UTC偏移量呢？
我们可以通过Date对象实例的getTimezoneOffset方法获取（注意返回的结果的单位为分）：
new Date().getTimezoneOffset()
可以看到输出的是-480，这样获得到的是0时区的时间差(0时区减去当前所在时区，单位是分钟)。
中国标准时间是以东八区为准，比0时区的时间要早8小时。所以是-480，除以60就是所在时区：然后-480 / 60 = -8，即现在这个时区的偏移量为0 - (-8) = 8，即表示为：UTC+8 ，代码为：
'UTC+' + (0 - new Date().getTimezoneOffset() / 60); // 输出：UTC+8
需要注意的是，不管你以何参数实例化一个Date对象，js在本地存储时，都会转化为本地时区，js不会帮你存储实例化该日期时的时区信息。
相比较来说，moment.js是一个很好的时间处理的库，如果有时间操作的业务还是直接使用moment.js库方便一点，当然，只是显示一下时区之类的，可以直接用上面简单处理即可。
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。
您可能感兴趣的文章:
-
-
-
location.hash保存页面状态的技巧
hash 属性是一个可读可写的字符串，该字符串是 URL 的锚部分（从 # 号开始的部分）。接下来通过本文给大家介绍location.hash保存页面状态的相关内容，感兴趣的朋友一起学习吧
2016-04-04
-
-
Highcharts使用简例及异步动态读取数据
Highcharts 是一个用纯JavaScript编写的一个图表库， 能够很简单便捷的在web网站或是web应用程序添加有交互性的图表，并且免费提供给个人学习、个人网站和非商业用途使用，通过本文给大家介绍Highcharts使用简例及异步动态读取数据的相关知识，感兴趣的朋友一起学习吧
2015-12-12
-
JS实现自动固定顶部的悬浮菜单栏效果
这篇文章主要介绍了JS实现自动固定顶部的悬浮菜单栏效果,涉及JavaScript针对window.onscroll事件的响应及页面样式动态变换的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
2015-09-09
-
JS中获取数据库中的值的方法
在项目中遇到一个问题，需要在JS中读取数据库中的值，然后再把值返回到页面中，解决方案如下:使用Ajax方法来实现，需要用到ajax.dll（一个ajax技术开发的帮助类库）。
2013-07-07
-
WebGL 绘制与变换使用示例详解
这篇文章主要为大家介绍了WebGL 绘制与变换使用示例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
2023-04-04
-
原生js实现日期选择插件
这篇文章主要为大家详细介绍了原生js实现日期选择插件，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2020-05-05
-
小程序简单两栏瀑布流效果的实现
这篇文章主要介绍了小程序简单两栏瀑布流效果的实现,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2019-12-12
-
js实现点击切换卡片功能
这篇文章主要为大家详细介绍了js实现点击切换卡片功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2021-08-08
