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库方便一点,当然,只是显示一下时区之类的,可以直接用上面简单处理即可。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • Javascript 世界时区时间显示代码

    Javascript 世界時間時間顯示 //https://gist.github.com/1326893https://gist.github.com/1326893 //20120511 Geovin Du 塗聚文 function calcTime(city, offset) { var d = new Date(); utc = d.getTime() + (d.getTimezoneOffset() * 60000); var nd = new Date(utc + (3600000

  • javascript时区函数介绍

    js的时区函数: 设datename为创建的一个Date对象 ==================== datename.getTimezoneOffset() --取得当地时间和GMT时间(格林威治时间)的差值,返回值以分钟为单位 ==================== 举例:根据本地时间获得GMT时间和任意时区的时间 d=new Date(); //创建一个Date对象 localTime = d.getTime(); localOffset=d.getTimezoneOffset()*6

  • 使用js判断当前时区TimeZone是否是夏令时

    复制代码 代码如下: var d1 = new Date(2009, 0, 1); var d2 = new Date(2009, 6, 1); if (d1.getTimezoneOffset() != d2.getTimezoneOffset()) { alert('Daylight Saving Time'); //夏令时 } else { alert('Daylight Time'); //非夏令时 }

  • JS彻底弄懂GMT和UTC时区

    目录 前言 一.GMT 什么是GMT GMT的历史 二.UTC 什么是UTC UTC 由两部分构成: UTC的历史 三.GMT vs UTC 四.时区 时区是如何定义的 五.夏令时 什么是夏令时 夏令时的历史 夏令时的争议 六.本地时间 七.JavaScript中的Date 前言 格林威治时间.世界时.祖鲁时间.GMT.UTC.跨时区.夏令时,这些眼花缭乱的时间术语,我们可能都不陌生,但是真正遇到问题,可能又不那么确定,不得不再去查一查,处理完可能过段时间又忘记.今天,我们彻底来梳理一下它们.

  • javascript+php实现根据用户时区显示当地时间的方法

    本文实例讲述了javascript+php实现根据用户时区显示当地时间的方法.分享给大家供大家参考.具体如下: 在跨时区应用中会用到下面代码,这是以前写的一段代码. 服务器保存相关时间配置,保存形式为GMT时间,客户端需要根据客户所在时区做相应显示,以符合客户习惯. 1. JavaScript代码如下: window.onload = function() { //TODO begin 处理登陆用户时区 //获得登陆用户时区与GMT时区的差值 var exp = new Date(); var

  • js获得当前时区夏令时发生和终止的时间代码

    复制代码 代码如下: <!DOCTYPE html> <html> <head> <title>DST Calculator</title> <script type="text/javascript"> function DisplayDstSwitchDates() { var year = new Date().getYear(); if (year < 1000) year += 1900; var

  • JavaScript 脚本将当地时间转换成其它时区

    但是,如果你想显示不同地区的时间---例如,如果你的本部在别的国家,你想查看"本国"时间而非当地时间,又该怎么办呢?要做到这一点,必须进行各种时间计算才能将当地时间转换为目的时间.本文将解释如何进行这些计算. 第一步: 事情的第一步是获得当地时间.在JavaScript中,这无疑可以通过初始化一个Data()对象来轻松完成. // create Date object for current location d = new Date(); 通过调用Data()对象的getTime()

  • JS时间戳与日期格式互相转换的简单方法示例

    JS和jQuery用了一段时间,最近发现他们没有自带的时间戳格式化函数,于是综合网上相关的时间戳格式化函数,自己写了一个时间戳格式化函数DateToTime,这个函数提供了多种格式化样式: Y-m-d,Y-m-d H:i:s,Y/m/d,Y/m/d H:i:s,Y年m月d日,Y年m月d日 H:i:s 这里的时间有时仅输入Y-m-d H:i也是可以使用的 /**  * [TimeToDate时间戳转换为日期]  * @param {[type]} unixTime [时间戳]  * @param 

  • Javascript 日期处理之时区问题

    复制代码 代码如下: //dateObj是一个日期对象,days表示给这个日期加多少天,比如说4,5(天) function dateAdd(dateObj,days){ var tempDate = dateObj.valueOf(); tempDate = tempDate + days * 24 * 60 * 60 * 1000; tempDate = new Date(tempDate); return tempDate; } //然后使用,创建一个日期对象 var dateValue

  • JavaScript获取时区实现过程解析

    在一个大型的项目中,不可避免会出现操作时间的业务,比如时间的格式化,比如时间的加减,我们一般会直接使用moment.js库来做,毕竟稳定可靠,也方便,那当我们系统只是几个简单页面,对时间的操作并不是很大,引入库文件并不是很必须的情况,我们需要时区展示怎么办?是不是可以用浏览器支持的原生方法来实现? 时区 啥是时区? 时区是地球上的区域使用同一个时间定义.以前,人们通过观察太阳的外置(时角)决定时间,这就使得不同经度的地方的时间各有不同,为了统一使用同一个时间,就引入了时区的概念.时区通过设立一个

  • JavaScript实现单链表过程解析

    前言: 要存储多个元素,数组是最常用的数据结构,但是数组也有很多缺点: 数组的创建通常要申请一段连续的内存空间,并且大小是固定的,所以当当前数组不能满足容量需求时,需要进行扩容,(一般是申请一个更大的数组,然后将原数组中的元素复制过去) 在数组元素开头或者中间位置插入数据的成本很高,需要进行大量元素的位移. 所以要存储多个元素,另一个选择就是链表,不同于数组的是,链表中的元素在内存中不必是连续的空间.链表的每个元素有一个存储元素本身的节点和指向下一个元素的引用.相对于数组,链表有一些优点: 内存

  • Javascript Web Worker使用过程解析

    Web Worker 概述 JavaScript 语言采用的是单线程模型,也就是说,所有任务只能在一个线程上完成,一次只能做一件事.前面的任务没做完,后面的任务只能等着.随着电脑计算能力的增强,尤其是多核 CPU 的出现,单线程带来很大的不便,无法充分发挥计算机的计算能力. Web Worker 的作用,就是为 JavaScript 创造多线程环境,允许主线程创建 Worker 线程,将一些任务分配给后者运行.在主线程运行的同时,Worker 线程在后台运行,两者互不干扰.等到 Worker 线

  • Javascript幻灯片播放功能实现过程解析

    javascript实现幻灯片播放 实现原理 step1 设置容器,包含图片.翻页.下标等元素,通过相对定位来布局. step2 将幻灯片变化,需要改变的元素放在一个字容器内,display设为none,并且采取动画来变化. step3设置js函数,将应该播放的元素样式激活,其他的元素仍为未激活状态或者不展示类的隐藏. 代码 html <!DOCTYPE html> <html> <head> <meta charset="UTF-8">

  • 基于python实现获取网页图片过程解析

    环境:python3, 要安装bs4这个第三方库 获取请求头的方法 这里使用的是Chrome浏览器. 打开你想查询的网站,按F12,或者鼠标右键一下选择检查.会弹出如下的审查元素页面: 然后点击上方选项中的Network选项: 此时在按Ctrl+R: 选择下方框中的第一个,单击: 选择Headers选项,其中就会有Request Headers,包括你需要的信息. 介绍:这个程序是用来批量获取网页的图片,用于新手入门 注意:由于是入门的程序在获取某些网页的图片时会出问题!!!!! import

  • Python获取浏览器窗口句柄过程解析

    句柄(handle)是C++程序设计中经常提及的一个术语.它并不是一种具体的.固定不变的数据类型或实体,而是代表了程序设计中的一个广义的概念.句柄一般是指获取另一个对象的方法--一个广义的指针,它的具体形式可能是一个整数.一个对象或就是一个真实的指针,而它的目的就是建立起与被访问对象之间的惟一的联系 使用 selenium 获取窗口句柄 from selenium import webdriver import time # chromedriver的绝对路径 # driver_path = r

  • JavaScript Tab菜单实现过程解析

    Tab 选项卡切换效果在现如今的网页中,运用的也是比较多的,包括点击切换.滑动切换.延迟切换.自动切换等多种效果 代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>tab</title> <style> *{ margin: 0px; padding: 0px; } .current{

  • JavaScript获取当前url路径过程解析

    这篇文章主要介绍了JavaScript获取当前url路径过程解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 1.假设当前页完整地址是:http://localhost:61768/Home/Index?id=2&age=18 //获取当前窗口的Url var url = window.location.href; //结果:http://localhost:61768/Home/Index?id=2&age=18 //获取当前窗口的主

  • JavaScript实现双向链表过程解析

    目录 一.什么是双向链表 二.双向链表的封装 三.双向链表的常用操作 1.append(element)方法-----向列表尾部添加一个项 2.将链表转化为字符串形式 3.insert(position,element):向列表的特定位置插入一个项 4.get(position):获取对应位置的元素 5.indexOf(element):返回元素在列表中的索引 6. update(position,ele):修改某个位置的元素 7.removeAt(position):从列表的指定位置移除一项

  • Oracle 两个逗号分割的字符串,获取交集、差集(sql实现过程解析)

    Oracle数据库的两个字段值为逗号分割的字符串,例如:字段A值为"1,2,3,5",字段B为"2". 想获取两个字段的交集(相同值)2,获取两个字段的差集(差异值)1,3,5. 一.最终实现的sql语句 1.获取交集(相同值): select regexp_substr(id, '[^,]+', 1, rownum) id from (select '1,2,3,5' id from dual) connect by rownum <= length(reg

随机推荐