A summary of the difference compatibility between IE and Firefox under JavaScript _javascript skills

Window.event Object Differences
IE: There are window.event objects
FF: No Window.event object. You can pass an event object to a parameter of a function. such as Onmousemove=domousemove (event)

get the current coordinates of the mouse
Ie:event.x and Event.y.
FF:event.pageX and Event.pagey.
General: Both have Event.clientx and Event.clienty attributes.

the current coordinates of the mouse (plus the distance the scroll bar rolls over)
IE:event.offsetX and Event.offsety.
FF:event.layerX and Event.layery.

coordinates of the x and Y of the label: Style.posleft and Style.postop
IE: there is.
FF: No.
General: Object.offsetleft and Object.offsettop.


Get the height and width of a form
IE:document.body.offsetWidth and Document.body.offsetHeight. Note: The page must have a body tag at this point.
FF:window.innerWidth and Window.innerhegiht, as well as Document.documentElement.clientWidth and document.documentElement.clientHeight.
General: Document.body.clientWidth and Document.body.clientHeight.

Adding events
IE:element.attachEvent ("onclick", func);
FF:element.addEventListener ("Click", Func, True).
General: Element.onclick=func. Although you can use the OnClick event, the effect of the onclick and the above two methods is not the same, onclick only executes a process, and attachevent and AddEventListener execute a list of processes, that is, multiple processes. For example: Element.attachevent ("onclick", func1), Element.attachevent ("onclick", Func2) so func1 and Func2 will be executed.

Here broken bridge Snow, once wrote a common add Delete binding event function, you can view the following article: JavaScript cross-browser Add Delete event binding function

Custom properties for labels
IE: If a property value is defined for the label DIV1, the value can be obtained Div1.value and div1["value".
FF: cannot be taken with Div1.value and div1["value".
General: Div1.getattribute ("value").

parent node, child node, and delete node
Ie:parentelement, Parement.children,element.romovenode (true).
Ff:parentnode, Parentnode.childnodes,node.parentnode.removechild (node).


Clientx,pagex,offsetx,x,layerx,screenx,offsetleft
ScreenX: The coordinates of the mouse on the display screen.
ClientX: The coordinates of the mouse display area on the page.
Note: All the above two are common to all browsers. The following are unique methods:

Pagex:ff unique, the mouse position on the page, starting from the top left corner of the page positioning, this can be very convenient in the entire page positioning, ie no direct replacement attributes.
Layerx:ff unique, the mouse is positioned relative to the boundary of the position's parent element closest to the level of the element that triggers the event, starting from the upper-left corner of the border, that is, if the parent element exists border, The coordinate origin is in the upper-left corner of the border, not the upper-left corner of the content area.
Offsetx:ie unique, the mouse relative to the "trigger event element" position, starting from the top left corner of the content area, not from the top left corner of border! This property is useful to determine where the mouse point in an element is convenient, FF does not have a direct replacement attribute.
X:ie unique, with Layerx an effect, can be used as a direct replacement of Layerx properties.
Note: IE and FF positioning has a 1px difference, in fact, ie positioning from 0 onwards, FF positioning from 1, FF will always be larger than IE 1px, need to deal with the actual situation.

Offsetleft: This property is not the property of the event object, but of the DOM object, which represents the position of the DOM object in the "nearest to the object in the hierarchy of the DOM object, setting the Position parent object", though that is But different browsers do not have the same effect.

FF in strict accordance with the above instructions to execute, in Ie6/7, however, this property returns the position of the DOM object in its immediate parent, but IE8 corrects the problem, but IE8 has a new problem, and the other browsers are positioned from the upper-left corner of the parent object's content area. IE8 is indeed from the parent element of the border in the upper left corner of the position, because the test environment for the IETester IE8, can not be excluded is the problem of IETester.