js .html方法 ie8,IE8下js,css兼容问题记录整理

这些天在改数据平台IE8下的一些兼容问题(js,css)，在此把遇到的问题都记录一下，以后有时间的话也能回头看看

1、background-size

IE8是不支持CSS3属性background-size的，因此在使用该属性设置背景图大小时，在IE8下会使背景图大小显示不正常

解决方法有2，

方法一.

filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(

src='images/logo.gif',

sizingMethod='scale');

-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(

src='images/logo.gif',

sizingMethod='scale')";

// 该方法存在以下问题：

// 1.不能指定任意大小background百分比，可用cover

// 2.用于单张图片不能使用图片精灵等拼图。

// 3.图片地址要使用绝对地址形式

// 4.兼容IE7、8

方法二

.selector { background-size: cover; -ms-behavior: url(/backgroundsize.min.htc); }

// 该方法需注意的问题：

// 1.可指定百分比

// 2. .htc要相对文档路径

// 3.兼容IE7、8

在实际解决问题时，使用的第二种方法。并且设置backgound-size:50% 50%\9；

2、gradient

IE8不支持渐变属性gradient ，像这样

background-image: -ms-gradient(linear, left top, left bottom, from(#0f59b1), color-stop(0.5, #155eb1), to(#124da1));

这样的写法在IE8下背景图不能正常显示。

解决方法如下：

filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr='#FF0000',endColorStr='#F9F900',gradientType='0');

// 且该属性必须写在最后 ,startColorStr ：起始颜色 ,endColorStr:结束颜色，gradientType为0表示垂直渐变，为1表示水平渐变。

3、preventDefault()

preventDefault()：阻止浏览器的默认行为，如点击a标签跳转新页面 等等 ，但在IE下是不支持该方法的，需要使用window.event.returnValue = false来实现。

完整代码如下

if(event.preventDefault){

event.preventDefault();

}else{

window.event.returnValue=false;

}

4、js报错：缺少标识符、字符串或数字

原因是在IE下，json最后一项的末尾不允许有逗号，其他浏览器则可有可无

var data={

name:"test",

age:23,

school:"beijingdaxue", // 末尾的逗号，在IE下会报错

}

5、属性”$“的值为null、未定义或不是Function对象

原因是找不到指定的jquery文件

6、indexOf() 问题

var arr=['aaa','bbb','cccc'];

if(arr.indexOf('aaa')>-1){

console.log('-----包含aaa')

}

在IE8下数组不支持indexOf()方法，解决的办法有二，

1、使用jQuery中的方法$.inArray()替代之,当然可要首先引入jQuery.js

var arr=['aaa','bbb','ccccc','dde'];

if($.inArray('aaa',arr)>-1){

console.log()

}

2、在使用indexOf()之前先判断以下是否有indexOf()  (在网上找的)

//添加数组IndexOf方法

if (!Array.prototype.indexOf){

Array.prototype.indexOf = function(elt /*, from*/){

var len = this.length >>> 0;

var from = Number(arguments[1]) || 0;

from = (from < 0)

? Math.ceil(from)

: Math.floor(from);

if (from < 0)

from += len;

for (; from < len; from++){

if (from in this && this[from] === elt)

return from;

}

return -1;

};

}

原文链接：http://blog.leanote.com/post/jiang/IE8%E5%85%BC%E5%AE%B9%E9%97%AE%E9%A2%98