1 序言
ps:第四节写了我碰到的问题和解决办法，对后面不感兴趣的能够间接跳到那里
在我的项目的进行中，原有的失常显示在win7零碎中呈现许多异样，起因是因为win7自带的ie版本是ie8，而现金罕用的win10自带的是ie11，在编写代码的时候没有思考周全是一点，另外一点须要留神的是，即便在win10环境下把以后ie调节成ie8，器兼容性的测试也是存在差别的，局部在ie8中无奈兼容的函数，在win10 中的ie8中兼容（如Array.isArray），临时未找到具体起因。因而在我的项目中须要兼容ie8的许多内容。
2 开始
因为习惯了框架的写法，忽然转到原生jquery的世界还有许多有余的中央，很多的操作都是边查边写，也闹出了不少那种在外行里看来滑稽的操作手法，不过能实现就行了（强行阿Q）。过后问了大佬这种原生兼容性的有什么比拟好的，快捷的，不便的写法，被举荐引入polyfill，被框架惯坏了的人，是真的要去多补充一点babel和webpack相干的常识了，在polyfill的帮忙下，我能够尽量少的去更改我原有的一些习惯写法，这一切都是那么的完满，工作进度也失常的推动，实现了编写后，本人简略的测试一下，没有任何异样，直到测试关上了win7零碎，不能说是全副不能用，也就大部分间接炸穿，款式畸形，接口返回异样。
3 起因
兼容性异样的问题次要集中在以下几个局部：
- 款式异样：具体表现就是移位错位，这部分相对来说好改，之前思考了局部款式兼容的问题；
- 对象不存在：通常来说就是你想用的这个快捷办法函数或者性能是在ie8外面不反对的；
- ie8不反对跨域拜访：如果接口都是get申请还好，然而post跨域是相对会被毙掉的，手都不给你握，就是这么任性；
- 局部事件响应机制的异样，绑定的keydown和你想要的不统一，监听函数写法也存在差别
4 问题和解决办法
以下问题都是在ie8下的兼容解决，不确定在其余环境能够胜利
问题：input 无奈获取焦点的，怎么点都不显示
解决办法：input 不能设置为通明背景或者none，另外，ie9以下不反对 type=search
问题：对象不存在
我碰到的次要有以下几种，其中bind是为了应用监听函数引入的
/** * @desc 兼容ie6 7 8 JSON * @author baidu */ if (!window.JSON) { window.JSON = { parse: function (jsonStr) { return eval("(" + jsonStr + ")"); }, stringify: function (jsonObj) { var result = "", curVal; if (jsonObj === null) { return String(jsonObj); } switch (typeof jsonObj) { case "number": case "boolean": return String(jsonObj); case "string": return '"' + jsonObj + '"'; case "undefined": case "function": return undefined; default: break; } switch (Object.prototype.toString.call(jsonObj)) { case "[object Array]": result += "["; for (var i = 0, len = jsonObj.length; i < len; i++) { curVal = JSON.stringify(jsonObj[i]); result += (curVal === undefined ? null : curVal) + ","; } if (result !== "[") { result = result.slice(0, -1); } result += "]"; return result; case "[object Date]": return ( '"' + (jsonObj.toJSON ? jsonObj.toJSON() : jsonObj.toString()) + '"' ); case "[object RegExp]": return "{}"; case "[object Object]": result += "{"; for (i in jsonObj) { if (jsonObj.hasOwnProperty(i)) { curVal = JSON.stringify(jsonObj[i]); if (curVal !== undefined) { result += '"' + i + '":' + curVal + ","; } } } if (result !== "{") { result = result.slice(0, -1); } result += "}"; return result; case "[object String]": return '"' + jsonObj.toString() + '"'; case "[object Number]": case "[object Boolean]": return jsonObj.toString(); default: break; } } }; } // 兼容Array.isArray if (!Array.isArray) { Array.isArray = function (arg) { return Object.prototype.toString.call(arg) === "[object Array]"; }; } // 兼容bind函数 if (!Function.prototype.bind) { Function.prototype.bind = function () { if (typeof this !== "function") { throw new TypeError( "Function.prototype.bind - what is trying to be bound is not callable" ); } var _this = this; var obj = arguments[0]; var ags = Array.prototype.slice.call(arguments, 1); return function () { _this.apply(obj, ags); }; }; }问题：也是对象不存在，不过时监听函数
我因为有对页面中的iframe传message，还有就是全局监听单击事件，所有须要addEventListener和removeEventListener，然而在ie8中不反对，还有一点很重要的就是，在ie8中不能间接写window.attachEvent("onkeydown", keyDownSaveAs());这样的，他会异样，必须要写function套住才行，具体实现方法如下：
// 监听函数 if (window.attachEvent) { window.attachEvent("onkeydown", function (e) { // keyDownSaveAs(e); 这里写本人的函数办法 stopDefault(e); }); } else if (window.addEventListener) { window.addEventListener("keydown", function (e) { // keyDownSaveAs(e); 这里写本人的函数办法 stopDefault(e); }); } //阻止默认浏览器行为 function stopDefault(e) { //如果提供了事件对象，则这是一个非IE浏览器 if (e && e.preventDefault) { //阻止默认浏览器动作(W3C) e.preventDefault(); } else { //IE中阻止函数器默认动作的形式 window.event.returnValue = false; } return false; } // 解除监听 if (window.removeEventListener) { window.removeEventListener("keydown", keyDownSaveAs, false); } else { window.detachEvent("onkeydown", keyDownSaveAs.bind(window)); }问题：post申请无奈跨域
讲真，我查了很久，找了很多办法，如果有人碰到了问题，能够先借鉴这位 不意识，然而和我的异样截然不同 的解决办法。然而我在用了所有办法之后还是存在问题，不分明是不是因为jsp写页面的起因（我也是第一次接触jsp），而后就向后端大佬求救，他把原来的接口映射到了以后域名，就没有了跨域问题了。。。。。
ps2:真的真的真的记得写兼容性前对不确定的办法函数查一下 Can I Use 会少走很多弯路