toLocaleTimeString()方法在IE和谷歌浏览器上 根据本地时间格式,把 Date 对象的时间部分(不含日期)转换为“时间字符串”存在区别
这两天修改一个bug,发现一个问题: toLocaleTimeString()方法在IE和谷歌浏览器上 根据本地时间格式,把 Date 对象的时间部分(不含日期)转换为“时间字符串”存在区别。方法原本应该是没有区别的,经过浏览器处理以后才出现的区别!
下面是测试代码:
/*
* 验证Date 对象(时间模块) toLocaleTimeString()方法分别在IE和谷歌浏览器上 根据本地时间格式,把 Date 对象的时间部分转换为“时间字符串”存在区别
* 从而区别substr(index,length)方法为什么在处理同一个时间字符串,在两个浏览器上的到的结果不一样!
* */
function localeTime(){ //toLocaleTimeString() 根据本地时间格式,把 Date 对象的时间部分(不含日期)转换为字符串。
var date = new Date(); //toLocaleTimeString()转换的时间,会在时、分、秒不足十的情况下在前面自行加"0",如"01:02:03" 两个浏览器都会
var localeTime = date.toLocaleTimeString();
console.log(localeTime,localeTime.length);
for(var i= 0; i<localeTime.length; i++){
console.log(localeTime[i]);
}
var substr = localeTime.substr(0,6);
console.log(substr);
}
function hou_min_sec(){ //getHours(),getMinutes(),getSeconds() 单独获取Date 对象时分秒,然后通过拼接整合成一个时间字符串。
var date = new Date(); //getHours(),getMinutes(),getSeconds() 获取的时间,"不会"在时、分、秒不足十的情况下自行加"0",如"1:2:3",若要格式一样,则需要另行处理 两个浏览器都不会
var hou = date.getHours();
var min = date.getMinutes();
var sec = date.getSeconds();
var hou_min_sec = hou +":"+ min +":"+ sec;
console.log(hou_min_sec,hou_min_sec.length);
for(var i= 0; i<hou_min_sec.length; i++){
console.log(hou_min_sec[i]);
}
var substr = hou_min_sec.substr(0,6);
console.log(substr);
}
截图如下:
图1:此图为两方法在谷歌上的运行情况,可以看出上部分 toLocaleTimeString()处理的,为分、秒分别补0了;下部分是分别获取的分、秒,没有补0。
图2:此图为两方法在IE11上的运行情况。出问题了,上部分 toLocaleTimeString()处理的,在为分、秒分别补0的操作下,还为开头和":"的左右各加了一个空格,从而导致整个字符串的长度由原来的8加长到13,从而导致了 substr(index,length) 方法的运行结果与预想的不一致;而下部分由于是分别获取的时,分、秒,虽然没有补0,但是字符串是我们自己拼接的,不存在添加空格这个问题,所以 substr(index,length) 方法的运行结果与预想的一致,能得到我们想要的字符串。
图3:此图为两方法在谷歌上的运行情况,在时、分、秒都超过10的情况下,显示的结果字符串和数据长度是一致的。
图4:此图为两方法在IE11上的运行情况,在时、分、秒都超过10的情况下,显示的结果字符串看似一样。其实不一样,两者长度区别,由于toLocaleTimeString() 添加空格的缘故。
图5:此图为两方法在谷歌上的运行 substr(index,length)的 情况,由于数据长度是一致的,所以所得到的字符串是一样的。
图6:此图为两方法在IE11上的运行 substr(index,length)的 情况,由于数据长度不一致的,所以所得到的字符串也不一样。
最后,对于单独获取的时、分、秒,即getHours(),getMinutes(),getSeconds()三个方法获得的结果,如果不足"十",在格式上其他格式存在差异,只需要判定补足就行。
function hou_min_sec(){
var date = new Date();
var hou = date.getHours().toString();
var min = date.getMinutes().toString();
var sec = date.getSeconds().toString();
if(hou.length == 1){ //通过判定各个变量的长度(先将它们的值转化为字符串格式),来确定它们是否不足十
hou = "0" + hou; //反正它们最后都是以字符串形式拼接,所以我认为这样补"0"最简单
}else if(min.length == 1){
min = "0" + min;
}else if(sec.length == 1){
sec = "0" + sec;
}
var hou_min_sec = hou +":"+ min +":"+ sec;
console.log(hou_min_sec,hou_min_sec.length);
for(var i= 0; i<hou_min_sec.length; i++){
console.log(hou_min_sec[i]);
}
var substr = hou_min_sec.substr(0,6);
console.log(substr);
}
toLocaleTimeString()方法在IE和谷歌浏览器上 根据本地时间格式,把 Date 对象的时间部分(不含日期)转换为“时间字符串”存在区别的更多相关文章
- JavaScript -- 时光流逝(五):js中的 Date 对象的方法
JavaScript -- 知识点回顾篇(五):js中的 Date 对象的方法 Date 对象: 用于处理日期和时间. 1. Date对象的方法 <script type="text/ ...
- new Date() 对象及方法:
在别人的代码中见了两回 new Date().toLocaleString(),查了才知道,toLocaleString()是 根据本地时间格式,把 Date 对象转换为字符串.于是好奇new Dat ...
- 用HTML5 video标签插入视频,在谷歌浏览器上播放视频时,右下角显示的下载按钮怎么去掉
使用H5的video标签可以直接插入视频,一般在浏览器效果如下图显示: 但有时在谷歌浏览器上显示,会遇到右下角有下载按钮.如果项目要求去掉这个下载按钮,怎么办呢?如下图显示: 分析: 经本人测试,是谷 ...
- 如何在windows上调试安卓机谷歌浏览器上的页面
- 下面的方法仅在windows和安卓机上测试过,,,, - 手机(安卓机)需要安装chrome与电脑(Windows)上的chrome配合,也就是只能调试谷歌浏览器上的页面 1.手机的准备工作 打开 ...
- scala 学习笔记(04) OOP(上)主从构造器/私有属性/伴生对象(单例静态类)/apply方法/嵌套类
一.主从构造器 java中构造函数没有主.从之分,只有构造器重载,但在scala中,每个类都有一个主构造器,在定义class时,如果啥也没写,默认有一个xxx()的主构造器 class Person ...
- 两种方法上传本地文件到github
https://www.jianshu.com/p/c70ca3a02087 自从使用github以来,一直都是在github网站在线上传文件到仓库中,但是有时因为网络或者电脑的原因上传失败.最重要的 ...
- HTML5 FormData 方法介绍以及实现文件上传
XMLHttpRequest 是一个浏览器接口,通过它,我们可以使得 Javascript 进行 HTTP (S) 通信.XMLHttpRequest 在现在浏览器中是一种常用的前后台交互数据的方式. ...
- Py之Crawler:爬虫利用随机选取代理访问服务器的方法实现下载某网址上所有的图片到指定文件夹——Jason niu
#Py之Crawler:爬虫利用随机选取代理访问服务器的方法实现下载某网址上所有的图片到指定文件夹 import urllib.request import os import random def ...
- 两种方法上传本地文件到github(转)
自从使用github以来,一直都是在github网站在线上传文件到仓库中,但是有时因为网络或者电脑的原因上传失败.最重要的原因是我习惯本地编辑,完成以后再一起上传github.看过了几个教程,总结出最 ...
随机推荐
- [Alpha]Scrum Meeting#10
github 本次会议项目由PM召开,时间为4月13日晚上10点30分 时长25分钟 任务表格 人员 昨日工作 下一步工作 木鬼 撰写每日例会报告撰写并整理任务分配博客 撰写每日例会报告配合测试.验收 ...
- depmod -a
分析可加载模块的依赖性,生成modules.dep文件和映射文件 intelligent bash: ' while true;do grep "reading error" ue ...
- C#方法重载和方法重写的区别
一.重载的条件: 1.必须在同一个类中: 2.方法名必须相同: 3.参数列表不能相同. 二.重写的条件: 1. 在不同的类中2. 发生方法重写的两个方法返回值,方法名,参数列表必须完全一致(必须具有相 ...
- (转)MySQL 主从复制搭建,基于日志(binlog
原文:http://blog.jobbole.com/110934/ 什么是MySQL主从复制 简单来说,就是保证主SQL(Master)和从SQL(Slave)的数据是一致性的,向Master插入数 ...
- Ubuntu系统Apache Maven安装
操作系统:Linux x64 / Ubuntu 14.04 Apache Maven版本:3.3.9 建议预先搭建Java开发环境:详见上一篇<Linux Ubuntu系统下Java开发环境搭建 ...
- 定时IIS任务自动停止及解决办法
---恢复内容开始--- 操作系统:WinServer2008 R2 IIS版本:IIS7.0 目的:利用IIS挂载服务,定时或循环作业 症状:在网站的Global.asax.cs文件的Applica ...
- 20个专业H5(HTML5)动画工具推荐
AnimateMate 可能是最好的 Sketch 动画插件.Sketch 目前被广泛应用于 HTML5 的原型界面设计,或者被应用于数据可视化的,动画部分则一般经由软件 Principle 等实现. ...
- shell脚本分析apache日志状态码
一.首先将apache日志按天切割 vi /etc/httpd/conf/httpd.conf ErrorLog "|rotatelogs /var/log/httpd/%Y% ...
- io多大合适
MySQL的cpu iowait值,<=1/(number of cores).例如,如果是8核的,io wait 应<=12%. "Monitor DB CPU IO wait ...
- WCF-ServiceEndpoint的监听地址与监听模式
ServiceEndpoint具有一个可读可写的ListenUri属性,该属性表示服务端终结点的物理监听地址,该地址默认和终结点逻辑地址一致(即ServiceEndpoint的Uri).对于客户端来说 ...