Firefox和IE兼容性問題及解決方法總結_javascript技巧

1.兼容firefox的 outerHTML，FF中沒有outerHtml的方法
代碼如下:
if (window.HTMLElement) {
HTMLElement.prototype.__defineSetter__("outerHTML",function(sHTML) {
var r=this.ownerDocument.createRange();
r.setStartBefore(this);
var df=r.createContextualFragment(sHTML);
this.parentNode.replaceChild(df,this);
return sHTML;
});

HTMLElement.prototype.__defineGetter__("outerHTML",function() {
var attr;
var attrs=this.attributes;
var str="<"+this.tagName.toLowerCase();
for (var i=0;i";
return str+">"+this.innerHTML+"";
});

HTMLElement.prototype.__defineGetter__("canHaveChildren",function() {
switch(this.tagName.toLowerCase()) {
case "area":
case "base":
case "basefont":
case "col":
case "frame":
case "hr":
case "img":
case "br":
case "input":
case "isindex":
case "link":
case "meta":
case "param":
return false;
}
return true;
});
}

2.集合類對象問題

說明:IE下,可以使用()或[]獲取集合類對象;Firefox下,只能使用[]獲取集合類對象.解決方法:統一使用[]獲取集合類對象.

3.自定義屬性問題

說明:IE下,可以使用獲取常規屬性的方法來獲取自定義屬性,也可以使用getAttribute()獲取自定義屬性;Firefox下,只能使用getAttribute()獲取自定義屬性.解決方法:統一通過getAttribute()獲取自定義屬性.

4.eval("idName")問題

說明:IE下,,可以使用eval("idName")或getElementById("idName")來取得id為idName的HTML對象;Firefox下只能使用getElementById("idName")來取得id為idName的HTML對象.解決方法:統一用getElementById("idName")來取得id為idName的HTML對象.

5.變量名與某HTML對象ID相同的問題

說明:IE下,HTML對象的ID可以作為document的下屬對象變量名直接使用;Firefox下則不能.Firefox下,可以使用與HTML對象ID相同的變量名;IE下則不能。 解決方法:使用document.getElementById("idName")代替document.idName.最好不要取HTML對象ID相同的變量名,以減少錯誤;在聲明變量時,一律加上var,以避免歧義.

6.const問題

說明:Firefox下,可以使用const關鍵字或var關鍵字來定義常量;IE下,只能使用var關鍵字來定義常量.解決方法:統一使用var關鍵字來定義常量.

7.input.type屬性問題

說明:IE下input.type屬性為只讀;但是Firefox下input.type屬性為讀寫.

8.window.event問題

說明:window.event只能在IE下運行,而不能在Firefox下運行,這是因為Firefox的event只能在事件發生的現場使用.解決方法:

IE:

...

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com