javascript中日期函数new Date()的浏览器兼容性问题


Posted in Javascript onSeptember 05, 2015

同一种语言javascript,在不同的浏览器中,存在语言兼容性问题,本质上是由于不同的浏览器是支持的语言标准和实现上各有差异。本文将基于new Date来创建Date对象来分析这个问题。

1.  问题的提出, 开始时间和结束时间空间无法正确的传递值

    在页面中,我们使用了一个时间上的组件来开发时间选择框,但是发现在Firefox下是无法正常工作的,在Chrome下是可以正常运行的。 问题出在哪里呢?

2.  问题分析

    结果分析发现是由于如下代码产生的问题:  

var timestart = '2010-05-04';
var timeend = '2015-09-05';
var time1 = (timestart+' 00:00:00').toString();
var time2 = (timeend+' 23:59:59').toString();
timestart = new Date(time1);
timeend = new Date(time2);

  问题就在于 new Date(time1)这个构造函数无法正确的生成Date对象,其值为NaN. 怪哉,问题在哪里呢?

3. 各个浏览器上的表现

  在IE下的执行情况:

  javascript中日期函数new Date()的浏览器兼容性问题

 在Firefox下的执行情况:

  javascript中日期函数new Date()的浏览器兼容性问题  在Chrome下的执行情况:

   javascript中日期函数new Date()的浏览器兼容性问题

    通过以上的分析,可以得知,这个javascript的脚本在Chrome下是可以正确执行的,但是在其他浏览器下报出错误。

4. 正确的做法

以下列出正确的做法:

var time1 = (timestart+' 00:00:00').toString();
 var time2 = (timeend+' 23:59:59').toString();
 timestart = new Date(Date.parse(time1.replace(/-/g,"/"))).getTime();
 timeend = new Date(Date.parse(time2.replace(/-/g,"/"))).getTime();

主要的变化是对默认的日期格式进行了转换, 基于'/'格式的日期字符串,才是被各个浏览器所广泛支持的,‘-'连接的日期字符串,则是只在chrome下可以正常工作。

5. 知识点总结

'2015-09-05'是无法被各个浏览器中,使用new Date(str)来正确生成日期对象的。 正确的用法是'2015/09/06'.

Javascript 相关文章推荐
JQuery入门——用bind方法绑定事件处理函数应用介绍
Feb 05 Javascript
Extjs中RowExpander控件的默认展开问题示例探讨
Jan 24 Javascript
JavaScript操作DOM元素的childNodes和children区别
Apr 01 Javascript
百度地图API之本地搜索与范围搜索
Jul 30 Javascript
javascript鼠标跟随运动3种效果(眼球效果,苹果菜单,方向跟随)
Oct 27 Javascript
浅谈JS函数定义方式的区别
Oct 30 Javascript
JavaScript实现倒计时跳转页面功能【实用】
Dec 13 Javascript
微信小程序 摇一摇抽奖简单实例实现代码
Jan 09 Javascript
Ionic2开发环境搭建教程
Aug 20 Javascript
Node.js 使用流实现读写同步边读边写功能
Sep 11 Javascript
基于JS实现html中placeholder属性提示文字效果示例
Apr 19 Javascript
微信小程序实现星级评价效果
Dec 28 Javascript
js 判断所选时间(或者当前时间)是否在某一时间段的实现代码
Sep 05 #Javascript
javascript 判断两个日期之差的示例代码
Sep 05 #Javascript
js实现图片放大和拖拽特效代码分享
Sep 05 #Javascript
js制作带有遮罩弹出层实现登录注册表单特效代码分享
Sep 05 #Javascript
js实现仿MSN带关闭功能的右下角弹窗代码
Sep 04 #Javascript
js实现浮动在网页右侧的简洁QQ在线客服代码
Sep 04 #Javascript
JS实现先显示大图后自动收起显示小图的广告代码
Sep 04 #Javascript
You might like
发布一个迷你php+AJAX聊天程序[聊天室]提供下载
2007/07/21 PHP
使用prototype.js进行异步操作
2007/02/07 Javascript
用js实现输入提示(自动完成)的实例代码
2013/06/14 Javascript
JavaScript中关联原型链属性特性
2016/02/13 Javascript
深入浅析knockout源码分析之订阅
2016/07/12 Javascript
javascript中使用未定义变量或值的情况分析
2016/07/19 Javascript
jquery mobile移动端幻灯片滑动切换效果
2020/04/15 Javascript
JavaScript中的子窗口与父窗口的互相调用问题
2017/02/08 Javascript
js封装成插件_Canvas统计图插件编写实例
2017/09/12 Javascript
node通过npm写一个cli命令行工具
2017/10/12 Javascript
TypeScript基础入门教程之三重斜线指令详解
2018/10/22 Javascript
每天学点Vue源码之vm.$mount挂载函数
2019/03/11 Javascript
vue-resource:jsonp请求百度搜索的接口示例
2019/11/09 Javascript
Python实现的生成自我描述脚本分享(很有意思的程序)
2014/07/18 Python
Python实现读取目录所有文件的文件名并保存到txt文件代码
2014/11/22 Python
python将ip地址转换成整数的方法
2015/03/17 Python
python基于multiprocessing的多进程创建方法
2015/06/04 Python
Python模拟百度登录实例详解
2016/01/20 Python
python递归查询菜单并转换成json实例
2017/03/27 Python
Python利用Beautiful Soup模块创建对象详解
2017/03/27 Python
Python动态导入模块的方法实例分析
2018/06/28 Python
Python操作rabbitMQ的示例代码
2019/03/19 Python
Python求离散序列导数的示例
2019/07/10 Python
python列表插入append(), extend(), insert()用法详解
2019/09/14 Python
python如何利用Mitmproxy抓包
2020/10/10 Python
中国最大的团购网站:聚划算
2016/09/21 全球购物
经济实惠的豪华家具:My-Furniture
2019/03/12 全球购物
JAVA中的关键字有什么特点
2014/03/07 面试题
服装销售人员求职自我评价
2013/09/26 职场文书
和平主题的演讲稿
2014/01/12 职场文书
《临死前的严监生》教学反思
2014/02/13 职场文书
环境工程专业自荐信范文
2014/06/24 职场文书
新闻学专业求职信
2014/07/28 职场文书
MySql开发之自动同步表结构
2021/05/28 MySQL
详解使用内网穿透工具Ngrok代理本地服务
2022/03/31 Servers
Windows Server 2012 修改远程默认端口3389的方法
2022/04/28 Servers