1.window.event問(wèn)題
說(shuō)明:window.event只能在IE下運(yùn)行,而不能在Firefox下運(yùn)行,這是因?yàn)镕irefox的event只能在事件發(fā)生的現(xiàn)場(chǎng)使用.
解決方法: 在觸發(fā)事件的函數(shù)上使用(aEvent)參數(shù)，例如下面的
- objNode.onmouseover=function(aEvent){
- var myEvent = window.event ? window.event.srcElement : aEvent.target;
- //執(zhí)行其他動(dòng)作
- }
（每次用事件之前Firefox都需要用getEvent()獲取一下，否則就是空）
2.event.x與event.y問(wèn)題
說(shuō)明:IE下,even對(duì)象有x,y屬性,但是沒(méi)有pageX,pageY屬性;Firefox下,even對(duì)象有pageX,pageY屬性,但是沒(méi)有x,y屬性.
解決方法:使用mX(mX = event.x ? event.x : event.pageX;)來(lái)代替IE下的event.x或者Firefox下的event.pageX.
3.event.srcElement問(wèn)題
說(shuō)明:IE下,even對(duì)象有srcElement屬性,但是沒(méi)有target屬性;Firefox下,even對(duì)象有target屬性,但是沒(méi)有srcElement屬性.
解決方法:使用obj(obj = event.srcElement ? event.srcElement : event.target;)來(lái)代替IE下的event.srcElement或者Firefox下的event.target.
4.window.location.href問(wèn)題
說(shuō)明:IE或者Firefox2.0.x下,可以使用window.location或window.location.href;Firefox1.5.x下,只能使用window.location.
解決方法:使用window.location來(lái)代替window.location.href.
5.模態(tài)和非模態(tài)窗口問(wèn)題
說(shuō)明:IE下,可以通過(guò)showModalDialog和showModelessDialog打開(kāi)模態(tài)和非模態(tài)窗口;Firefox下則不能.
解決方法:直接使用window.open(pageURL,name,parameters)方式打開(kāi)新窗口。
如果需要將子窗口中的參數(shù)傳遞回父窗口,可以在子窗口中使用window.opener來(lái)訪問(wèn)父窗口. 例如：
- var parWin = window.opener;
- parWin.document.getElementById("itemID").value = "some value";
6.frame問(wèn)題
以下面的frame為例：<frame src="xxx.html" id="frameId" name="frameName" />
(1)訪問(wèn)frame對(duì)象:
IE:使用window.frameId或者window.frameName來(lái)訪問(wèn)這個(gè)frame對(duì)象.
Firefox:只能使用window.frameName來(lái)訪問(wèn)這個(gè)frame對(duì)象.
另外，在IE和Firefox中都可以使用window.document.getElementById("frameId")來(lái)訪問(wèn)這個(gè)frame對(duì)象.
(2)切換frame內(nèi)容:
在IE和Firefox中都可以使用window.document.getElementById("testFrame").src = "xxx.html"或window.frameName.location = "xxx.html"來(lái)切換frame的內(nèi)容.
如果需要將frame中的參數(shù)傳回父窗口，可以在frame中使用parent來(lái)訪問(wèn)父窗口。例如：parent.document.form1.filename.value="some value";
7.body問(wèn)題
Firefox的body在body標(biāo)簽沒(méi)有被瀏覽器完全讀入之前就存在；而IE的body則必須在body標(biāo)簽被瀏覽器完全讀入之后才存在.
例如：
Firefox：
程序代碼
- <body>
- <script type="text/javascript">
- document.body.onclick = function(evt){
- evtevt = evt || window.event;
- alert(evt);
- }
- </script>
</body>
IE&Firefox：
程序代碼
- <body>
- </body>
- <script type="text/javascript">
- document.body.onclick = function(evt){
- evtevt = evt || window.event;
- alert(evt);
- }
- </script>
8.nodeName 和 tagName 問(wèn)題
問(wèn)題：在MF,IE中，所有節(jié)點(diǎn)均有 nodeName 值，但 textNode 沒(méi)有 tagName 值。
解決方法：使用 tagName，但應(yīng)檢測(cè)其是否為undefined。
9.url encoding
問(wèn)題：js中如果書(shū)寫(xiě)url就直接寫(xiě)&不要寫(xiě)&例如var url = 'xx.jsp?objectName=xx&objectEvent=xxx';
frm.action = url那么很有可能url不會(huì)被正常顯示以至于參數(shù)沒(méi)有正確的傳到服務(wù)器，一般會(huì)服務(wù)器報(bào)錯(cuò)參數(shù)沒(méi)有找到；當(dāng)然如果是在tpl中例外，因?yàn)閠pl中符合x(chóng)ml規(guī)范，要求&書(shū)寫(xiě)為&
一般MF無(wú)法識(shí)別js中的&
10.children 與 childNodes，removeNode
問(wèn)題一：在MF中沒(méi)有 parentElement parement.children 而用 parentNode parentNode.childNodes
問(wèn)題二：childNodes的下標(biāo)的含義在IE和MF中不同，MF使用DOM規(guī)范，childNodes中會(huì)插入空白文本節(jié)點(diǎn)。
問(wèn)題三：一般可以通過(guò)node.getElementsByTagName()來(lái)回避這個(gè)問(wèn)題。當(dāng)html中節(jié)點(diǎn)缺失時(shí)，IE和MF對(duì)parentNode的解釋不同，例如
<form>
<table>
</table>
</form>
MF中input.parentNode的值為form, 而IE中input.parentNode的值為空節(jié)點(diǎn)
問(wèn)題四：MF中節(jié)點(diǎn)沒(méi)有removeNode方法，必須使用如下方法 node.parentNode.removeChild(node)
11.HTML 對(duì)象的 id 作為對(duì)象名的問(wèn)題
(1)現(xiàn)有問(wèn)題
在 IE 中，HTML 對(duì)象的 ID 可以作為 document 的下屬對(duì)象變量名直接使用。在 ff 中不能。
(2)解決方法
用 getElementById("idName") 代替 idName 作為對(duì)象變量使用。
12.在ff中沒(méi)有 parentElement parement.children 而用 parentNode parentNode.childNodes
childNodes的下標(biāo)的含義在IE和ff中不同，ff使用DOM規(guī)范，childNodes中會(huì)插入空白文本節(jié)點(diǎn)。
一般可以通過(guò)node.getElementsByTagName()來(lái)回避這個(gè)問(wèn)題。
當(dāng)html中節(jié)點(diǎn)缺失時(shí)，IE和ff對(duì)parentNode的解釋不同，例如
- <form>
- <table>
- <input/>
- </table>
- </form>
ff中input.parentNode的值為form, 而IE中input.parentNode的值為空節(jié)點(diǎn)
ff中節(jié)點(diǎn)沒(méi)有removeNode方法，必須使用如下方法 node.parentNode.removeChild(node)
13.DOM 數(shù)據(jù)島的問(wèn)題
(1)現(xiàn)有問(wèn)題
在IE中, <xml>標(biāo)簽具有特殊意義, 可以內(nèi)含XML DOM, 并能實(shí)現(xiàn)與HTML組件的數(shù)據(jù) 綁定. 在MF中,<xml>則僅僅是一個(gè)未知的標(biāo)記而已. 另外, 對(duì) IE 來(lái)說(shuō), <xml>實(shí)際意味著這里是一個(gè)ActiveX對(duì)象, 但它卻掛在HTML本 身的DOM樹(shù)下作為一個(gè)節(jié)點(diǎn), 因而會(huì)對(duì)DOM樹(shù)的遍歷造成嚴(yán)重影響.
(2)解決方法
IE的數(shù)據(jù)綁定機(jī)制是可以用JS來(lái)模擬的, 但是太麻煩, 建議不使用數(shù)據(jù)綁定機(jī)制或者 尋找實(shí)現(xiàn)這種模擬的庫(kù)來(lái)做. 我們只討論如何實(shí)現(xiàn)DOM的兼容. 在MF中無(wú)論已知的HTML標(biāo)記還是其它符合XML規(guī)范的標(biāo)記, 都是用統(tǒng)一的DOM樹(shù)來(lái)處理的, 因此, MF事實(shí)上完全可以使用DOM數(shù)據(jù)島, 但與IE小小的不同在于: 在IE中<xml> 是個(gè) DOM document, 而在MF只是 DOM node. 這個(gè)差別通常不足為患. 但是有一個(gè)小小的細(xì)節(jié), 為了兼容HTML相當(dāng)隨意的語(yǔ)法, MF無(wú)法識(shí)別簡(jiǎn)寫(xiě)的空標(biāo)記. 如: <xml id="xx"><book><title>xxxx</title><content/><index/></book></xml>, 這其中<content/>和<index/>是簡(jiǎn)寫(xiě)形式的, 會(huì)使MF無(wú)法識(shí)別, 應(yīng)當(dāng)寫(xiě)成: <content></content><index></index> 不過(guò), 我懷疑如果用XHTML, 可能就沒(méi)有這種問(wèn)題. 但我還沒(méi)有試過(guò). 對(duì)于IE中<xml>干擾HTML的DOM結(jié)構(gòu)問(wèn)題, 我現(xiàn)在的方法是處理完畢后把它從HTML的 DOM中刪除. 不知道還有沒(méi)有更好的解.
14.firefox與IE(parentElement)的父元素的區(qū)別
IE：obj.parentElement
firefox：obj.parentNode
解決方法: 因?yàn)閒irefox與IE都支持DOM,因此使用obj.parentNode是不錯(cuò)選擇.
15.FireFox中類(lèi)似 obj.style.height = imgObj.height 的語(yǔ)句無(wú)效
解決方法：obj.style.height = imgObj.height + 'px';
16. ie,firefox以及其它瀏覽器對(duì)于 table 標(biāo)簽的操作都各不相同
在ie中不允許對(duì)table和tr的innerHTML賦值，使用js增加一個(gè)tr時(shí)，使用appendChile方法也不管用。
解決方法：
//向table追加一個(gè)空行：
var row = otable.insertRow(-1);
var cell = document.createElement("td");
cell.innerHTML = " ";
cell.className = "XXXX";
row.appendChild(cell);
17ie支持document.all 而firefox 不支持
改用下面三個(gè)tag的其中一個(gè)來(lái)代替document.all
getElementsByTagName("tagName") 可以得到得到所有標(biāo)簽元素的集合
getElementById("idName") 可以按id得到某一元素
getElementsByName("Name") 可以得到按name屬性得到某一元素
18.firefox 中使用innerHTML 的方法
document.all.online.innerHTML; //這種方法在IE中可以使用，但不是標(biāo)準(zhǔn)方法
document.getElementById("online").innerHTML; //這樣firefox就能使用innerHTML了
19.對(duì)事件處理函數(shù)的重寫(xiě)
解決：（例）:如對(duì)document的onclick()重寫(xiě)，統(tǒng)一使用document.onclick = function(){…}
20.屏蔽Form提交事件
event.returnValue=false;// for IE
evt.preventDefault();//for firefox
21.獲取事件源
var source=event.srcElement //IE
var source=event.target //firefox
22.添加事件兼容寫(xiě)法
function addEvent(oElement,sEvent,func){
if (oElement.attachEvent){
oElement.attachEvent(sEvent,func);
}
else{
sEventsEvent=sEvent.substring(2,sEvent.length);
oElement.addEventListener(sEvent,func,false);
}
}
解決方法：addEvent(window,"onload",Start);
23.長(zhǎng)度：FireFox長(zhǎng)度必須加“px”，IE無(wú)所謂
24.XmlHttp
在IE中，XmlHttp.send(content)方法的content可以為空，而firefox則不能為空，應(yīng)該用send(" ")，否則會(huì)出現(xiàn)錯(cuò)誤
25.事件追加方法 attachEvent(IE)/detachEvent;addEventListener( Mozilla, Netscape, Firefox)/removeEventListener
又或者直接用obj.onmouseover=func;
26.Firefox中不存在 Event時(shí)間,必須通過(guò)object本身去取
在Firefox獲取當(dāng)前物件的坐標(biāo)方法：
- document.onmousemove = Inti_move;
- function Inti_move(ert)
- {
- x=ert.pageX;
- }
27.
- function getChild(o) {
- var allChild = o.childNodes;
- var tmpArray = new Array();
- for (var i=0;i<allChild.length;i++) {
- if (allChild[i].nodeType == 1) {
- tmpArray.push(i);
- }
- }
- var o = tmpArray;
- return o;
- }
如果某個(gè)元素的子節(jié)點(diǎn)是元素的話就保留push到一個(gè)新數(shù)組里
這樣子FF可以兼容了
400 186 1886
