前一篇不知道怎么被博客园给删了,重新补发一个。

 最近在项目中发现一个很诡异的问题,通过js获取cookie时,发现赋给用户name的时候IE9和低于9以下的浏览器对比时获取到的名字不一样,通过调试发现是split方法在解析||时当值为空时就会出现被“吃掉”的问题。

 当我们在开发的过程想要对特定的字符进行分割,首相想到的就是使用split函数,这样是一个效率非常高的方法。但是让人叹息的是该方法虽然可以在Chrome和Firefox正常运作,但是在低版本IE浏览器却无法正常工作,IE9及以上版本都没有问题。split方法是支持正则表达式的,ES中还对它的获取匹配和贪婪模式做了一些定义,低版本IE浏览器尚未兼容上。这些新概念不被兼容是无可厚非的,但是低版本IE甚至连split的基本功能都没兼容好。split方法使用正则表达式时,返回的结果中就会吞掉所有空字符串。下面展示下相同的方法在不同版本IE浏览器下获取到的值: 

  IE8获取的结果:

  

  IE9获取的结果:

  有没有发现区别在哪里?IE8的行为很诡异吧?原本应为9个参数的,可是在IE8中却成为了8个参数,原本为空的值在IE8中直接被饥渴的IE8给吞掉了。于是就研究了下解决方案,和大家分享一下。

  1:如果我们需要同时使用多个字符切字符串又想兼容IE8可以先把需要用于切割的字符replace到同一个字符再执行split。(虽然效率不高)。

  2:如果要用非消耗匹配的正则去分割字符串,而且还想兼容好IE8的话,那就只有另谋出路吧,别想split了。 这里再跟大家分享一种不需要改动原来的代码,只需要在你的代码中添加如下函数,即可解决split函数在IE浏览器下无法使用的问题:

//重写split 用于解决IE7,IE8,IE9的split的兼容性(panda-2016-06-16)
var split; split = split || function (undef) { var nativeSplit = String.prototype.split,
compliantExecNpcg = /()??/.exec("")[1] === undef,
self; self = function (str, separator, limit) {
if (Object.prototype.toString.call(separator) !== "[object RegExp]") {
return nativeSplit.call(str, separator, limit);
}
var output = [],
flags = (separator.ignoreCase ? "i" : "") +
(separator.multiline ? "m" : "") +
(separator.extended ? "x" : "") + // Proposed for ES6
(separator.sticky ? "y" : ""), // Firefox 3+
lastLastIndex = 0,
separator = new RegExp(separator.source, flags + "g"),
separator2, match, lastIndex, lastLength;
str += "";
if (!compliantExecNpcg) {
separator2 = new RegExp("^" + separator.source + "$(?!\\s)", flags);
}
limit = limit === undef ?
-1 >>> 0 : // Math.pow(2, 32) - 1
limit >>> 0; // ToUint32(limit)
while (match = separator.exec(str)) {
lastIndex = match.index + match[0].length;
if (lastIndex > lastLastIndex) {
output.push(str.slice(lastLastIndex, match.index));
if (!compliantExecNpcg && match.length > 1) {
match[0].replace(separator2, function () {
for (var i = 1; i < arguments.length - 2; i++) {
if (arguments[i] === undef) {
match[i] = undef;
}
}
});
}
if (match.length > 1 && match.index < str.length) {
Array.prototype.push.apply(output, match.slice(1));
}
lastLength = match[0].length;
lastLastIndex = lastIndex;
if (output.length >= limit) {
break;
}
}
if (separator.lastIndex === match.index) {
separator.lastIndex++;
}
}
if (lastLastIndex === str.length) {
if (lastLength || !separator.test("")) {
output.push("");
}
} else {
output.push(str.slice(lastLastIndex));
}
return output.length > limit ? output.slice(0, limit) : output;
};
String.prototype.split = function (separator, limit) {
return self(this, separator, limit);
}; return self; }();

  希望能对大家有所帮助!

  您的观看将是我最大的动力,您还可观看我其他的博客,写的不好请谅解。谢谢您给予的支持。 博客地址:http://www.cnblogs.com/zhangzhixiong/

split方法在低版本IE浏览器上无法解析的问题的更多相关文章

  1. 解决opacity属性在低版本IE浏览器下失效的方法

    以前,一直都以为ie9以下的版本不支持opacity属性.所以就同时使用 opacity和ie独特的filter蒙版.但是有些时候需要一些动态的效果,就比如层的渐渐消失,隐藏,就需要使用动态变化的op ...

  2. 模拟实现兼容低版本IE浏览器的原生bind()函数功能

    模拟实现兼容低版本IE浏览器的原生bind()函数功能: 代码如下: if(!Function.prototype.bind){   Function.prototype.bind=function( ...

  3. 如何让低版本IE浏览器支持HTML5标签并为其设置样式

    现代的浏览器都支持HTML5,HTML5定义了 8 个新的 HTML 语义元素.所有这些元素都是 块级 元素. 为了能让旧版本的浏览器正确显示这些元素,你可以设置 CSS 的 display 属性值为 ...

  4. HTML5中的语义标签兼容IE8以及更低版本的浏览器

    看某教程,说让HTML5的这些语义标签能够兼容低版本的浏览器,原文是“你可以设置css的display属性为block”.很好理解,就设置css样式为block嘛,那就直接设置咯: header, s ...

  5. 低版本IE浏览器 input元素出现叉叉的情况

    都说是IE10之上的浏览器才有这个问题,恰巧我IE10之上都没有问题,反而是低版本的浏览器出现了这个问题.作为一个凭证,我先放一张图片在这里面. 之前无意中解决过这个问题,如今复现确实是没有解决,网上 ...

  6. CSS的W3C标准的盒子模型和低版本IE浏览器的盒子模型

    CSS中盒子模型的组成由内容区(content).内边距(padding).边框(border).外边距(margin)组成.内边距可细分为 padding-top.padding-right.pad ...

  7. Android 高版本API方法在低版本系统上的兼容性处理

    Android 版本更替,新的版本带来新的特性,新的方法. 新的方法带来许多便利,但无法在低版本系统上运行,如果兼容性处理不恰当,APP在低版本系统上,运行时将会crash. 本文以一个具体的例子说明 ...

  8. javascript原生bind方法ie低版本兼容详解

    上一篇文章讲到了javascript原生的bind方法: http://www.cnblogs.com/liulangmao/p/3451669.html 这篇文章就在理解了原生bind方法的原理以后 ...

  9. 【前端】低版本IE浏览器访问网站一片空白

    最近在客户那里,发现一个奇葩的问题,系统上IE浏览器访问网站一片空白,显示无法访问. 但是相同的网站系统,在我们的电脑上又可以访问且IE浏览器版本相同,没法只有,装虚拟模拟客户环境复现一下了. 发现在 ...

随机推荐

  1. OpenJudge/Poj 1936 All in All

    1.链接地址: http://poj.org/problem?id=1936 http://bailian.openjudge.cn/practice/1936 2.题目: All in All Ti ...

  2. OpenJudge/Poj 1005 I Think I Need a Houseboat

    1.链接地址: http://bailian.openjudge.cn/practice/1005/ http://poj.org/problem?id=1005 2.题目: I Think I Ne ...

  3. PHP学习笔记——PHP脚本和JAVA连接mysql数据库

    环境 开发包:appserv-win32-2.5.10 服务器:Apache2.2 数据库:phpMyAdmin 语言:php5,java 平台:windows 10 java驱动:mysql-con ...

  4. js方法的命名不能使用表单元素的名称或ID

    今天在写页面的时候,遇到一个关于js方法的命名问题,先看下代码: 表单元素如下: <select name="isCulture" onchange="isCult ...

  5. BrowserSync:跨浏览器实时同步预览

    BrowserSync:跨浏览器实时同步预览 2016.09.11 官方网站:https://www.browsersync.io/ 项目仓库:https://github.com/Browsersy ...

  6. 请求与通配符 mime 映射相匹配。请求映射到静态文件处理程序。如果有不同的前提条件,请求将映射到另一个处理程序。

    打开IIS管理器,找到“处理程序映射”,在列表右击选择“添加脚本映射”即可.eg:*.aspx,将该类型的页面的处理程序映射为“%windir%\Microsoft.NET\Framework\v4. ...

  7. ajax、json一些整理(1)

    1.请求text数据,在success事件中手动解析 前台:                 $.ajax({                     type: "post", ...

  8. 简单的NHibernate学习笔记

    NHibernate是.NET平台下的ORM框架,与ADO.NET一样实现项目中数据库与项目系统的交互. .首先要用NHibernate框架就要有第三方的dll库来作为支持,附上百度云下载地址:(链接 ...

  9. php中的数组定义和使用

    <?php //这个是一个php关于数组的例子,简要的说明了数组的基本使用 //定义一个字符串数组 $fruit = array(\"apple\",\"orang ...

  10. 使用ECLIPSE+MINGW搭建C/C++开发环境

    有个朋友要我帮忙跑一个C程序而我现在主要用java,电脑上也就没有C语言的编译和开发环境,在学习java的这段期间,接触到了Eclipse这个强大的IDE,用惯了.就为调试一个程序,去安装一个VS觉得 ...