IE和火狐兼整理

一、firefox不支持innerText,IE和firefox都支持innerHTML。

解决方法：在非IE浏览器中使用textContent代替innerText。 
示例： 
if(navigator.appName.indexOf(”Explorer”) >-1){ 
document.getElementById(”element”).innerText = “my text”; 
}else{ 
document.getElementById(”element”).textContent = “my text”; 
} 
[注] innerHTML 同时被ie、firefox等浏览器支持，其余的，如outerHTML等只被ie支持，最好不用。

二、cursor:hand VS cursor:pointer 

问题说明：firefox不支持hand，但ie支持pointer ，二者都是手形指示。 
解决方法：统一使用pointer。

三、自定义属性问题 

问题说明：IE下，可使用获取常规属性的方法来获取自定义属性（即obj.自定义属性），也可使用 getAttribute() 获取自定义属性；Firefox下，只能使用 getAttribute() 获取自定义属性。 
解决方法：统一经过 getAttribute() 获取自定义属性。

四、集合类对象问题

问题说明：IE下，可使用()或[]获取集合类对象；Firefox下，只能使用[]获取集合类对象。 
解决方法：统一使用 [] 获取集合类对象。

五、捕获事件 
IE：obj.setCapture() 、obj.releaseCapture() 
Firefox：document.addEventListener(”mousemove”,mousemovefunction,true); 
document.removeEventListener(”mousemove”,mousemovefunction,true);

6.获取鼠标位置 
IE:event.clientX、event.clientY 
firefox：须要事件函数传递事件对象 
obj.onmousemove=function(ev){ 
X= ev.pageX;Y=ev.pageY; 
}

七、禁止选取网页内容 

在IE中通常用js：obj.onselectstart=function(){return false;} 
而firefox用CSS:-moz-user-select:none

八、DIV等元素的边界问题 
好比：设置一个div的CSS:：{width:100px;height:100px;border:#000000 1px solid;} 
IE中：div的宽度（包括边框宽度）：100px，div的高度（包括边框宽度）：100px； 
而firefox：div的宽度（包括边框宽度）：102px，div的高度（包括边框宽度）：102px；

九、const问题 
问题说明：Firefox下，可使用const关键字或var关键字来定义常量；IE下，只能使用var关键字来定义常量。 
解决方法：统一使用var关键字来定义常量。

十、input.type属性问题 

问题说明：IE下 input.type 属性为只读；可是Firefox下 input.type 属性为读写。 
解决办法：不修改 input.type 属性。若是必需要修改，能够先隐藏原来的input，而后在一样的位置再插入一个新的input元素。

十一、window.event问题 
问题说明：window.event 只能在IE下运行，而不能在Firefox下运行，这是由于Firefox的event只能在事件发生的现场使用。 
解决方法：在事件发生的函数上加上event参数，在函数体内(假设形参为evt)使用 var myEvent = evt?evt:(window.event?window.event:null) 
示例：<input type=”button” onclick=”doSomething(event)”/> 
<script language=”javascript”> 
function doSomething(evt) { 
var myEvent = evt ? evt: (window.event ? window.event : null) 
… 
}

十二、event.x与event.y问题 
问题说明：IE下，even对象有x、y属性，可是没有pageX、pageY属性；Firefox下，even对象有pageX、pageY属性，可是没有x、y属性。 
解决方法：var myX = event.x ? event.x : event.pageX;var myY = event.y ? event.y:event.pageY; 
若是考虑第8条问题，就改用myEvent代替event便可。

1三、event.srcElement、event.fromElement、event.toElement问题 
问题说明：IE下，even对象有srcElement属性，可是没有target属性；Firefox下，even对象有target属性，可是没有srcElement属性。 
解决方法：使用srcObj = event.srcElement ? event.srcElement : event.target; 

              var relTarg = e.relatedTarget || e.fromElement;

               var relTarg = e.relatedTarget || e.toElement;

 

1四、window.location.href问题 
问题说明：IE或者Firefox2.0.x下，可使用window.location或window.location.href；Firefox1.5.x下，只能使用window.location。 
解决方法：使用 window.location 来代替 window.location.href。固然也能够考虑使用 location.replace()方法。

1五、模态和非模态窗口问题 
问题说明：IE下，能够经过showModalDialog和showModelessDialog打开模态和非模态窗口；Firefox下则不能。 
解决方法：直接使用 window.open(pageURL,name,parameters) 方式打开新窗口。 
如 
果须要将子窗口中的参数传递回父窗口，能够在子窗口中使用window.opener来访问父窗口。若是须要父窗口控制子窗口的话，使用var 
subWindow = window.open(pageURL,name,parameters);来得到新开的窗口对象。

1六、对象宽高赋值问题 
问题说明：FireFox中相似 obj.style.height = imgObj.height 的语句无效。 
解决方法：统一使用 obj.style.height = imgObj.height + “px”;

1七、Table操做问题 
问题说明：ie、firefox以及其它浏览器对于 table 标签的操做都各不相同，在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); 

1八、MSXML.DOMDocument
    IE：xml = new ActiveXObject("MSXML.DOMDocument")，建立xml Dom对象
    Firefox：var domparser = new DOMParser(); xml = domparser.parseFromString(xml, "text/xml");  
    以上IE和Firefox不兼容，须要经过if (window.DOMParser)或者if (window.ActiveXObject)判断

1九、Microsoft.XMLHTTP

    IE：xmlhttp = new ActiveXObject("Microsoft.XMLHTTP")，建立xmlhttp对象
    Firefox：xmlhttp = new window.XMLHttpRequest()
    以上IE和Firefox不兼容，须要判断if (window.XMLHttpRequest)或者if (window.ActiveXObject)

  20、parentElement
    IE：obj.parentElement，获取父元素
    Firefox：obj.parentNode

2一、透明度

   IE：obj.style.filter = "alpha(opacity=50)" 或者 obj.filters.alpha.opacity=50 设置元素的透明度
    Firefox：obj.style.opacity = 0.5
    以上IE和Firefox不兼容，单位也不同，IE为100单位，Firefox为1单位。处理方法为两行同时使用

（集众家之所长

http://blog.sina.com.cn/s/blog_646e1e0201018kcg.html
https://www.cnblogs.com/binaryworms/articles/2318865.html

）

2二、currentStyle/getComputedStyle

TypeError: this.oSelectButton.currentStyle is undefined

getComputedStyle(obj,false)：在FF新版本中只须要第一个参数，即操做对象，第二个参数写“false”也是你们通用的写法，目的是为了兼容老版本的火狐浏览器。

兼容写法：

var oAbc = document.getElementById("abc");if(oAbc.currentStyle) {     //IE、Opera     alert(oAbc.currentStyle.width);} else {    //FF、chrome、safari    alert(getComputedStyle(oAbc,false).width);}