IE與firefox下Dhtml的一些區別小結
2024-05-06 14:12:35
供稿：網友
1.DOM上的接口基本上還是一致的，但經測試發現mozilla下的DOM更標準些,就算些法一樣，IE下會有一些微小的區別，但無關要緊
2.事件模型上，這方面區別算比較大.
mozilla下的e.target 相當于 ie下的event.srcElement,但細節上有區別，后者是返回一個html element
而e.target返回的是個節點，也就是說包括文本節點，方法可以這樣
var trg = e.target;
while(trg.nodeType!=1)trg=trg.parentNode;
mozilla下的e.which與ie下的event.keyCode相當
相對應的還有e.layerX,e.layerY,e.pageX,e.pageY...
可以看看http://fason.nease.net/mozilla/dom/ event部份
事件綁定上mozilla用addEventListener,removeEventListener,對應ie的attachEvent,detatchEvent
3.對象引用上就直接document.getElementById就行了，如果還要兼容ie4,可以再加上document.all判斷
form element的引用要標準些var oInput = document.formName.elements["input1"]
4.XML的應用上區別更大些，因為IE下是通過activex來創建，而mozilla已經是有這些對象的（需要dom2支持）
Xmldomdocument: var doc = document.inplementation.createDocument("","",null)
xmlhttp: var req = new XMLHttpRequest()
5.innerText就在mozilla不支持了，需要用些range的技巧來取得它的text
6.insertAdjacentHTML是個比較好用的方法，mozilla可以用DOM的方法insertBefore來兼容
7.更細微的，如Array,Date的一些方法ie和mozilla也會有一些微小的區別，具體不提到了。。。
寫了兩個例子:
1. 對于通過ID取對象
function getObjectById(id)
{
if (typeof(id) != "string" || id == "") return null;
if (document.all) return document.all(id);
if (document.getElementById) return document.getElementById(id);
try {return eval(id);} catch(e){ return null;}
}
2. 對事件附加處理函數
if(document.attachEvent)
window.attachEvent("onresize", function(){reinsert();});
else
window.addEventListener('resize', function(){reinsert();}, false);
注意在IE里是 onclick 而在firefox NS 里則是 click
用腳本提交
document.formName.action = "...";
document.formName.submit();
好像在mozilla下不能用
處理XML的方法
代碼如下:
var FCKXml = function()
{}
FCKXml.prototype.GetHttpRequest = function()
{
if ( window.XMLHttpRequest )// Gecko
return new XMLHttpRequest() ;
else if ( window.ActiveXObject )// IE
return new ActiveXObject("MsXml2.XmlHttp") ;
}
FCKXml.prototype.LoadUrl = function( urlToCall, asyncFunctionPointer )
{
var oFCKXml = this ;
var bAsync = ( typeof(asyncFunctionPointer) == 'function' ) ;
var oXmlHttp = this.GetHttpRequest() ;
oXmlHttp.open( "GET", urlToCall, bAsync ) ;
if ( bAsync )
{
oXmlHttp.onreadystatechange = function()
{
if ( oXmlHttp.readyState == 4 )
{
oFCKXml.DOMDocument = oXmlHttp.responseXML ;
asyncFunctionPointer( oFCKXml ) ;
}
}
}
oXmlHttp.send( null ) ;
