换工作之后需要兼容ie8的我

以下是我ie8踩得坑,总结了一下,以免以后会遇到,虽然有的度娘也能搜到但是偶尔看看自己的文章也能学到很多(后续如有添加继续补上)

1,ie8 input框建议不要使用line-height去撑高度,在ie下并不会实现文字垂直居中,用padding值去撑开

2,ie8浏览器对特殊字符解析,(解决方法是用base64转码,有封装好的函数,base64encode(utf16to8(filename))和base64_decode();)如果是url建议使用encodeURI(需注意的是使用encodeURI传码的时候需要传两次,否则不生效,后台URLDecoder () )

3,ie8浏览器有时会出现空白页(是因为页面有不符合的注释还有有的标签在写的时候木有闭合)

4,

自我遇见的问题,ie8下foreach不兼容导致乱码

if (typeof Array.prototype.forEach != 'function') {
Array.prototype.forEach = function(callback){
for (var i = 0; i < this.length; i++){
callback.apply(this, [this[i], i, this]);
}
};
}

5,Bind不兼容

(function(){
if (!Function.prototype.bind) {
Function.prototype.bind = function (oThis) {
if (typeof this !== "function") {
throw new TypeError("Function.prototype.bind - what is trying to be bound is not callable");
}
var aArgs = Array.prototype.slice.call(arguments, 1),//数组对象转数组
fToBind = this,
fNOP = function () {},
fBound = function () {
return fToBind.apply(this instanceof fNOP && oThis
? this
: oThis,//用来测试一个对象在原型链中是否存在构造函数的prototype属性
aArgs.concat(Array.prototype.slice.call(arguments)));//类数组对象
};
fNOP.prototype = this.prototype;
fBound.prototype = new fNOP();
return fBound;
};
}
}())

6,eval函数不支持特殊符号,如:eval(‘langZh.’+text);

7,function参数不能为表达式,如:function(flag=0)

8,box-shadow兼容IE8写法,使用filter滤镜属性实

-moz-box-shadow:3px 5px 5px #969696;
-webkit-box-shadow:3px 5px 5px #969696;
box-shadow:3px 5px 5px #969696;
filter: progid:DXImageTransform.Microsoft.Shadow(color='#cccccc',Direction=180, Strength=3);
 
//说明: direction是阴影方位(角度),strength是阴影大小(半径),单位为度,可以为负数,color是阴影颜色 (尽量使用数字)

9,使IE8浏览器支持背景半透明写法,使用filter滤镜属性实现

background: rgba(0,0,0,0.3);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4c000000,endColorstr=#4c000000);

10,使用IE8浏览器支持背景图片半透明opacity,使用filter滤镜属性实现

filter: alpha(opacity=100);
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
opacity: 1;

 
11,IE8浏览器不支持数组的indexof()方法
// 添加数组IndexOf方法
if(!Array.prototype.indexOf){
Array.prototype.indexOf=function(elt/*,from*/){
varlen=this.length>>>0;
varfrom=Number(arguments[1])||0;
from=(from<0)
?Math.ceil(from)
:Math.floor(from);
if(from<0)
from+=len;
for(;from<len;from++){
if(frominthis&&this[from]===elt)
returnfrom;
}
return-1;
};
}
12,不规则注释导致页面在ie、360、谷歌浏览器上不能正常显示
例如:<!--的德的-->
13,

html标签的拼写一定要正确并且标签一定要用一些常用的标签,不要自己随意编写,如<up></up>是错误的标签,spn,spam,不符合规范的都会报错,此问题出现的最多,必须要规范标签写法

  • 标签正确且常用
  • 标签成对
  • div嵌套要规范,嵌套层数太多时考虑有没有必要,尽量层数清晰。
原文地址:https://www.cnblogs.com/caixiufang/p/10775717.html