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 ) ; if ( ! bAsync && oXmlHttp.status && oXmlHttp.status == 200 ) this.DOMDocument = oXmlHttp.responseXML ; else throw( 'Error loading "' + urlToCall + '"' ) ; } FCKXml.prototype.SelectNodes = function( xpath, contextNode ) { if ( document.all )// IE { if ( contextNode ) return contextNode.selectNodes( xpath ) ; else return this.DOMDocument.selectNodes( xpath ) ; } else// Gecko { var aNodeArray = new Array(); var xPathResult = this.DOMDocument.evaluate( xpath, contextNode ? contextNode : this.DOMDocument, this.DOMDocument.createNSResolver(this.DOMDocument.documentElement), XPathResult.ORDERED_NODE_ITERATOR_TYPE, null) ; if ( xPathResult ) { var oNode = xPathResult.iterateNext() ; while( oNode ) { aNodeArray[aNodeArray.length] = oNode ; oNode = xPathResult.iterateNext(); } } return aNodeArray ; } } FCKXml.prototype.SelectSingleNode = function( xpath, contextNode ) { if ( document.all )// IE { if ( contextNode ) return contextNode.selectSingleNode( xpath ) ; else return this.DOMDocument.selectSingleNode( xpath ) ; } else// Gecko { var xPathResult = this.DOMDocument.evaluate( xpath, contextNode ? contextNode : this.DOMDocument, this.DOMDocument.createNSResolver(this.DOMDocument.documentElement), 9, null); if ( xPathResult && xPathResult.singleNodeValue ) return xPathResult.singleNodeValue ; else return null ; } }
IE与firefox下Dhtml的一些区别小结
声明:登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@