您好,登錄后才能下訂單哦!
這期內容當中小編將會給大家帶來有關如何探究IE和Firefox在JavaScript方面的兼容性,文章內容豐富且以專業的角度為大家分析和敘述,閱讀完這篇文章希望大家可以有所收獲。
IE和Firefox在JavaScript方面的兼容性
1.document.formName.item("itemName")問題
說明:IE下,可以使用document.formName.item("itemName")或document.formName.elements["elementName"];Firefox下,只能使用document.formName.elements["elementName"].
解決方法:統一使用document.formName.elements["elementName"].Text1:
document.formName.item("itemName") document.formName.elements["elementName"]
2.集合類對象問題
說明:IE下,可以使用()或[]獲取集合類對象;Firefox下,只能使用[]獲取集合類對象.
解決方法:統一使用[]獲取集合類對象.
Text2:
document.forms("formName") document.forms["formName"]
Text3:
document.getElementsByName("inputName")(0) document.getElementsByName("inputName")[0]
3.自定義屬性問題
說明:IE下,可以使用獲取常規屬性的方法來獲取自定義屬性,也可以使用getAttribute()獲取自定義屬性;Firefox下,只能使用getAttribute()獲取自定義屬性.
解決方法:統一通過getAttribute()獲取自定義屬性.
Text4:
直接獲取自定義屬性的值
通過getAttribute()獲取自定義屬性的值
4.eval("idName")問題
說明:IE下,,可以使用eval("idName")或getElementById("idName")來取得id為idName的HTML對象;Firefox下只能使用getElementById("idName")來取得id為idName的HTML對象.
解決方法:統一用getElementById("idName")來取得id為idName的HTML對象.
Text5:
eval("idName") document.getElementById("itemId")
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:
<inputnameinputname="Button8_1"type="button"value="IE" onclick="javascript:gotoSubmit8_1()"/> ... <scriptlanguagescriptlanguage="javascript"> functiongotoSubmit8_1(){ ... alert(window.event);//usewindow.event ... } script> IE&Firefox: <inputnameinputname="Button8_2"type="button"value="IE" onclick="javascript:gotoSubmit8_2(event)"/> ... <scriptlanguagescriptlanguage="javascript"> functiongotoSubmit8_2(evt){ ... evtevt=evt?evt:(window.event?window.event:null); alert(evt);//useevt ... } script>
9.event.x與event.y問題
說明:IE下,even對象有x,y屬性,但是沒有pageX,pageY屬性;Firefox下,even對象有pageX,pageY屬性,但是沒有x,y屬性.
解決方法:使用mX(mX=event.x?event.x:event.pageX;)來代替IE下的event.x或者Firefox下的event.pageX.
10.event.srcElement問題
說明:IE下,even對象有srcElement屬性,但是沒有target屬性;Firefox下,even對象有target屬性,但是沒有srcElement屬性.
解決方法:使用obj(obj=event.srcElement?event.srcElement:event.target;)來代替IE下的event.srcElement或者Firefox下的event.target。
11.window.location.href問題
說明:IE或者Firefox2.0.x下,可以使用window.location或window.location.href;Firefox1.5.x下,只能使用window.location.
解決方法:使用window.location來代替window.location.href.
12.模態和非模態窗口問題
說明:IE下,可以通過showModalDialog和showModelessDialog打開模態和非模態窗口;Firefox下則不能.
解決方法:直接使用window.open(pageURL,name,parameters)方式打開新窗口。
如果需要將子窗口中的參數傳遞回父窗口,可以在子窗口中使用window.opener來訪問父窗口.例如:varparWin=window.opener;parWin.document.getElementById("Aqing").value="Aqing";
13.frame問題
以下面的frame為例:
<framesrcframesrc="xxx.html"id="frameId"name="frameName"/>
(1)訪問frame對象:
IE:使用window.frameId或者window.frameName來訪問這個frame對象.
Firefox:只能使用window.frameName來訪問這個frame對象.
另外,在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中的參數傳回父窗口,可以在frme中使用parent來訪問父窗口。例如:parent.document.form1.filename.value="Aqing";
14.body問題
Firefox的body在body標簽沒有被瀏覽器完全讀入之前就存在;而IE的body則必須在body標簽被瀏覽器完全讀入之后才存在.
例如:
Firefox:
<body> <scripttypescripttype="text/javascript"> document.body.onclick=function(evt){ evtevt=evt||window.event; alert(evt); } script> body> IE&Firefox: <body> body> <scripttypescripttype="text/javascript"> document.body.onclick=function(evt){ evtevt=evt||window.event; alert(evt); } script>
上述就是小編為大家分享的如何探究IE和Firefox在JavaScript方面的兼容性了,如果剛好有類似的疑惑,不妨參照上述分析進行理解。如果想知道更多相關知識,歡迎關注億速云行業資訊頻道。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。