【积累】各浏览器之间的差异

1.在js中修改元素background-size样式

火狐：obj.style['backgroundSize']='XXX';

谷歌及其他：obj.style['background-size']='XXX'; 或obj.style['backgroundSize']='XXX';

2.火狐无法再JS中操作float，需要在样式表中写。

3.360浏览器这个傻逼用useragent检测出来是chrome，但是它的内核调用却是safari，太屎了！

4.Array对象支持差异

   (1)join方法

   假设有一个数组：arr={'a','b','c'}

   其他浏览器：arr.join(undefind); //a,b,c

   IE7:arr.join(undefind);//aundefindbundefindc

   (2)indexof和lastIndexof方法

    IE8及以下不支持该方法。

5.IE和FF差异

(1) window.event：

表示当前的事件对象，IE有这个对象，FF没有，FF通过给事件处理函数传递事件对象

(2) 获取事件源

IE用srcElement获取事件源，而FF用target获取事件源

(3) 添加，去除事件

IE：element.attachEvent(“onclick”, function) element.detachEvent(“onclick”, function)

FF：element.addEventListener(“click”, function, true) element.removeEventListener(“click”, function, true)

(4) 获取标签的自定义属性

IE：div1.value或div1[“value”]

FF：可用div1.getAttribute(“value”)

(5) document.getElementByName()和document.all[name]

IE；document.getElementByName()和document.all[name]均不能获取div元素

FF：可以

(6) input.type的属性

IE：input.type只读

FF：input.type可读写

(7) innerText textContent outerHTML

IE：支持innerText, outerHTML

FF：支持textContent

(8) 是否可用id代替HTML元素

IE：可以用id来代替HTML元素

FF：不可以

(9)document appendChild的问题

IE:直接document.appendChild就可以了。

FF：必须是document.body.appendChild

(10)

IE:var a=function abc(){alert('aa');};    a(); abc();都会弹出aa，但是 a!=abc

FF:var a=function abc(){alert('aa');};    a(); abc(); a会弹出aa，abc会提示这个函数没有定义，但是 a==abc却成立。

(11)

IE:var tt=eval; tt('foo=1');  如果该eval在局部作用域中且局部作用域中有foo变量且有全局变量foo，foo就会改变这个局部foo变量的值.

FF:var tt=eval;tt('foo=1');   如果该eval在局部作用域中且局部作用域中有foo变量且有全局变量foo，foo就会改变这个全局foo变量的值.

6.标签的onload支持

IE下支持标签的onreadystatechange事件而不支持onload事件，且readyState有 loading loaded complete三个值。

其余浏览器支持onload事件而不支持onreadystatechange事件

opera则都支持。

 7.自定义属性支持

IE：如果是自定义属性，写在行间也是没有问题的，如 <img  ff="1"/>

除IE内核之外的浏览器：OPERA FF CHROME 不支持行间自定义属性， 只有写在javascript里，如 ： oImg["ff"]=1;

8.input button 标签去border后的样式

chrome:为了显示按钮的立体感，它会故意把按钮向规定的坐标下置1px

其他浏览器：不会这样。