Summary of some differences between Dhtml under IE and firefox_javascript skills

1. The interface on the DOM is basically the same, but after testing, it was found that the DOM under mozilla is more standard. Even if the methods are the same, there will be some minor differences under IE, but it doesn’t matter
2. In terms of event model, The difference in this aspect is relatively large.
e.target under mozilla is equivalent to event.srcElement under ie, but there are differences in details. The latter returns an html element
while e.target returns a node. That is to say, including text nodes, the method can be as follows:
var trg = e.target;
while(trg.nodeType!=1)trg=trg.parentNode;
e.which under mozilla is the same as under ie The event.keyCode is quite
corresponding to e.layerX, e.layerY, e.pageX, e.pageY...
You can check out http://fason.nease.net/mozilla/dom / event part
The event is bound to Mozilla using addEventListener, removeEventListener, corresponding to IE's attachEvent, detatchEvent
3. For the object reference, just document.getElementById is enough. If you want to be compatible with IE4, you can add document .all determines that the reference of
form element should be more standard var oInput = document.formName.elements["input1"]
4. The difference in the application of XML is bigger, because it is created through activex under IE, and mozilla already has these objects (requires dom2 support)
Xmldomdocument: var doc = document.inplementation.createDocument("","",null)
xmlhttp: var req = new XMLHttpRequest()
5 .innerText is not supported by Mozilla. You need to use some range techniques to get its text
6. insertAdjacentHTML is a relatively easy-to-use method. Mozilla can use the DOM method insertBefore to be compatible
7. More subtle , such as some methods of Array and Date, there will be some slight differences between ie and mozilla, which will not be mentioned in detail. . .
Write two examples:
1. For getting objects by 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. Attach a processing function to the event
if(document.attachEvent)
window.attachEvent("onresize", function(){reinsert ();});
else
window.addEventListener('resize', function(){reinsert();}, false);
Note that in IE it is onclick and in firefox NS it is click
Submit with script
document.formName.action = "...";
document.formName.submit();
It seems that the
method of processing XML cannot be used under mozilla

Copy code The code is as follows:

var FCKXml = function()
{}
FCKXml.prototype.GetHttpRequest = function()
{
if ( window.XMLHttpRequest )// Gecko
return new XMLHttpRequest() ;
else if ( window.ActiveXObject )// IE
return new ActiveXObject("MsXml2. 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 ;
}
}