兼容问题总结

1.HTML对象获取

FireFox：document.getElementById("idName");
IE：document.idname;  或  document.getElementById("idName");

解决方法：统一使用document.getElementById("idName");

2.const问题

FireFox：可以使用const或var关键字来定义常量；
IE：只能使用var关键字来定义常量。

解决办法：统一使用var定义常量。

3.event.x与event.y问题

FireFox：event对象有pageX和pageY属性，但没有x，y属性；
IE：event对象有x，y属性，但没有pageX，pageY属性。

解决方法：使用 mX(mX = event.x ? event.x : event.pageX;)来代替IE下的event.x 或者FireFox下的event.pageX

4.window.location.href问题

FireFox：在Firefox1.5.x下,只能使用window.location
在IE或者Firefox2.0.x下,可以使用window.location或window.location.href

解决方法：使用window.location来代替window.location.href

5.frame问题

以下面的frame为例：
<frame src="xxx.html" id="frameId" name="frameName" />
(1) 访问frame对象：
    FireFox：只能使用window.frameName来访问这个frame对象；
    IE：使用window.frameId或者window.frameName来访问这个frame对象.  frameId和frameName可以同名。
    另外，在IE和Firefox中都可以使用window.document.getElementById("frameId")来访问这个frame对象.

(2)切换frame内容：
    在 IE和Firefox中都可以使用window.document.getElementById("testFrame").src  =   "xxx.html"或window.frameName.location   =  "xxx.html"来切换frame的内容.
如果需要将frame中的参数传回父窗口(注意不是opener,而是parent  frame)，可以在frame中使用parent来访问父窗口。例如：parent.document.form1.filename.value="Aqing";

6.模态和非模态窗口问题

FireFox：FireFox不可以
IE：IE下,可以通过showModalDialog和showModelessDialog打开模态和非模态窗口

解决方法：直接使用window.open(pageURL,name,parameters)方式打开新窗口。
如果需要将子窗口中的参数传递回父窗口,可以在子窗口中使用window.opener来访问父窗口.
例如：var  parWin   =   window.opener;  parWin.document.getElementById("Aqing").value  =   "Aqing";

7.Firefox与IE的父元素的区别

Firefox：obj.parentNode
IE：obj.parentElement

解决方法：因为firefox与IE都支持DOM,因此可以使用obj.parentNode

8.document.formName.item("itemName")问题

IE：IE下，可以使用document.formName.item(”itemName”) 或 document.formName.elements["elementName"]；
Firefox：Firefox 下，只能使用document.formName.elements["elementName"]。

解决方法：统一使用document.formName.elements["elementName"]。

9.集合类对象问题

IE：IE下，可以使用 () 或 [] 获取集合类对象；
Firefox：Firefox下，只能使用 []获取集合类对象。

解决方法：统一通过getAttribute() 获取自定义属性。

10.自定义属性问题

IE：IE下，可以使用获取常规属性的方法来获取自定义属性，也可以使用getAttribute() 获取自定义属性；
Firefox：Firefox下，只能使用getAttribute() 获取自定义属性。

解决方法：统一通过getAttribute() 获取自定义属性。

11.input.type属性问题

IE：IE下input.type属性为只读；
Firefox：Firefox下input.type属性为读写。

解决方法：不修改input.type属性。如果必须要修改，可以先隐藏原来的input，然后在同样的位置再插入一个新的input元素。

12.event.srcElement问题

IE：IE下，even对象有srcElement属性，但是没有target属性；
Firefox：Firefox下，even对象有target属性，但是没有srcElement属性。

解决方法：使用srcObj =event.srcElement ?event.srcElement : event.target; 如果考虑第8条问题，就改用myEvent代替event即可。

13.事件委托方法

IE：IE下，使用document.body.onload= inject; 其中functioninject()在这之前已被实现；
FireFox：在Firefox下，使用document.body.onload= inject();

解决方法：统一使用document.body.onload=newFunction(’inject()’); 或者document.body.onload = function(){/* 这里是代码 */}

14.table操作问题

IE：在ie中不允许对table和tr的innerHTML赋值，使用js增加一个tr时，使用appendChild方法也不管用。

解决方法：//向table追加一个空行：
var row = otable.insertRow(-1);var cell =document.createElement("td");cell.innerHTML ="";cell.className = "XXXX";row.appendChild(cell);