IE与FF在js、css、html方面的不兼容问题

js要求：为使系统能在IE和FF下正常运行，不要使用原生态的javascript，建议使用js的库（如：jquery）

并且要求用jquery中，获取对象的属性使用$obj.attr("attrName"),不要使用obj.attrName,防止自定义的属性在FF中不能正常运行

1、问题：<span></span>在FF下运行不正常

解决方法：用<div></div>替换

2、现有问题：document.frames[i].document不能在FF下正常运行

解决方法：window.frames[i].document(IE,FF都可正常运行)

注意：这并不是说document对象在FF中不能使用，只是针对frames对象不能用document

3、改错：document.body.clientWidth，document.body.clientHeight在IE和FF下都能正常运行

4、判断IE浏览器和FF的JS

(1)if(navigator.appName.indexOf("Explorer")>-1){}//IE,Opera

else{}//FF

(2)if (document.all) {}//IE,原因是只有IE才支持document.all

else{}//FF

5、问题：node.firstChild在FF下不能正常运行

解决方法：用getElmentById("id")替换

6、问题：scroll='no'在FF中玩法正常运行

解决方法：style="overflow:hidden;"

7、问题：获取自定义属性

在FF中，自定义的属性必须用getAttribute()取得(IE也可以)

而IE可以直接通过“.”运算符获取

8、<tbody></tbody>不显示定义在FF下就找不到<tbody>对象

解决方法：在table中定义<thead>的同时也要显示定义<tbody>

9、脚本库Jquery.js不能随便换为jquery-1.3.2-min.js会报错

10、event对象在IE和FF中不同

（1）在 IE 中，事件对象是作为一个 全局变量 来保存和维护的。 所有的浏览器事件,不管是用户触发的，还是其他事件， 都会更新window.event 对象。 所以在代码中，只要轻松调用 window.event 就可以轻松获取 事件对象， 再 event.srcElement 就可以取得触发事件的元素进行进一步处理

在 ff 中，事件对象却 不是全局对象， 一般情况下，是现场发生，现场使用，ff把事件对象自动传递给对应的事件处理函数。

在代码中，函数的第一个参数就是FF下的事件对象了。在事件处理函数中可用arguments[0]来获取FF的event对象

（2）IE使用event.srcElement,FF使用 target

11、parentElement 获取对象层次中的父对象。

parentNode 获取文档层次中的父对象。

childNodes 获取作为指定对象直接后代的 HTML 元素和 TextNode 对象的集合。

children 获取作为对象直接后代的 DHTML 对象的集合。

parentNode和parentElement功能一样，childNodes和children功能一样。但是parentNode和childNodes是符合W3C标准的，可以说比较通用。而另外两个只是IE支持，不是标准，Firefox就不支持

12、问题：firefox Date 的getYear() 返回值和 IE不同

原因：在 Firefox 里面 getYear 返回的是 "当前年份-1900" 的值 (以前都如此)

在IE里面 当today的年份大于等于2000的时候 直接把1900加上了 返回的 200X (而不是10X)

解决方法：（1）year = (year<1900?(1900+year):year);（2）用getFullYear()替换,IE，FF都支持

13、div的高度、宽度

问题：在FF中，只指定width=100%没有指定高度，往div里面塞img时，img的高和宽会成比例缩放，height取img缩放后的高度，而不是取为100%

在IE中，只指定width=100%没有指定高度，往div里面塞img时，img不会显示，IE中height取0（个人意见）

解决方法：同时指定高度和宽度

14、鼠标样式

问题：FF不支持hand，但IE支持pointer

解决方法：统一使用pointer

15、问题：在Firefox里，鼠标点击一个链接时，它的周围即出现虚线画出的边框。

解决方法：a { outline: none; } 或者缩小范围： a:focus { outline: none; }

16、问题：innerText在FF中不能正常运行，firefox改成了contentText方法，并且在Firefox中文本中间的空白自符被无情的替换没了

解决方法：（1）可以用innerHTML代替（IE，FF都支持），FF默认支持innerHTML 其他的如innerText、outerText、outerHTML都不支持

（2）用Javascript重新定义了innerText方法 ，使得在Firefox中也可以使用innerText方法 ，并且此方法解决了firefox中空白字符的问题

使用方法：

将下面的脚本放在页面内 ，不管ie还是firefox都可以使用obj.innerText提取文本了

<script language="javascript">

function isIE(){ //ie?

if (window.navigator.userAgent.toLowerCase().indexOf("msie")> =1)

return true;

else

return false;

}

if(!isIE()){ //firefox innerText define

HTMLElement.prototype.__defineGetter__( "innerText", function(){

var anyString = "";

var childS = this.childNodes;

for(var i=0; i <childS.length; i++) {

if(childS[i].nodeType==1)

anyString += childS[i].tagName=="BR" ? '/n' : childS[i].innerText;

else if(childS[i].nodeType==3)

anyString += childS[i].nodeValue;

}

return anyString;

});

HTMLElement.prototype.__defineSetter__( "innerText", function(sText){

this.textContent=sText;

});

}

</script>

17、问题：单元格隐藏，在IE中，单元格的内容display=none后，此单元格也就不在占位了，但在FF中，此单元格仍会占位

解决方法：显示设置该单元格display=none

18、注：在FF中不支持children,但是表示frame的层级关系的parent,top

19、document.all不是标准的JS，在FF中不支持，可以用document.getElementByTagName("*")来代替

20、问题：FF中document.writeln('<iframe id="meizzDateLayer"></iframe>'),然后document.getElementById ("meizzDateLayer")会报错

在IE中不会报错

原因：加载顺序问题，在FF中执行document.getElementById("meizzDateLayer")时，iframe还没加载完（可用FireBug断点调试）

而在IE中不存在这样的问题

解决方法：（1）在iframe 加载后执行—>onload=get() (2)也可用window.onload =get()

注： function get(){document.getElementById("meizzDateLayer")........;}

更新中................................................