Js and css in IE and FireFox (FF) are different

Differences between js and css in IE and FireFox (FF)
Css:
1.
In the ul tag, FF has a padding value, but there is no margin value. In IE, the opposite is true.
Solution: Set ul's padding and margin to 0 (or not 0), for example, padding: 0; margin: 0; list-style: none;
Js:
1.
In IE, innerText is not in FF, and textContent is used;
Eg:
Copy codeThe Code is as follows:
Var obj = document. getElementById ("_ td ");
Var text;
If (obj. innerText ){
Text = obj. innerText;
} Else if (obj. textContent ){
Text = obj. textContent;
}

2.
In Ajax, the returned object state IE can use readystate, but the returned object state in FF must be readyState. Therefore, it is best to write readyState.
3. Obtain the keyboard return values in IE and FF,
<Input type = "text" onkeyUp = "test (event)"/>
Function test (e ){
Var keyc = GetKeyCode (e );
Alert (keyc );
}
Function GetKeyCode (e) {// obtain the keyboard event values in different browsers
Var keyc;
If (window. event) {// ie keyboard event
Keyc = e. keyCode;
} Else if (e. which) {// Firefox
Keyc = e. which;
}
Return keyc;
}
4. add and remove events for objects
Var obj = document. getElementById ("_ tname ');
Add event:
If (obj. attachEvent ){
Obj. attachEvent ("onchange", function (){
Otherfunction (params); // you can pass parameters to the actual method or call other methods directly.
});
} Else if (obj. addEventListener ){
Obj. addEventListener ("change", function (){
Otherfunction (params );
}, False );
}
Remove event:
Obj. onclick = null;
/* Why can't the following code work? The obj. onclick output in IE is anonymous. I hope experts can help solve this problem.
If (obj. detachEvent ){
Obj. detachEvent ("onchange", test );
} Else if (obj. removeEventListener ){
Obj. removeEventListener ("change", test, false );
}*/
5.
Event. x and event. y in IE
In FF, only event. pageX and event. pageY are available.
Both have the event. clientX and event. clientY attributes.
Solution:
Var x = e. x? E. x: e. pageX; // e is the parameter passed in by the event object.
6. The input. type attribute in IE is read-only, but can be modified in MF.
7. in IE, getElementsByName (), (document. all [name] (not tested yet) cannot be used to obtain the div element (whether there are other elements that cannot be retrieved are unknown ).
8. trigger events through js
<Script type = "text/javascript"> <! --
Function handerToClick (){
Var obj = document. getElementById ("btn1 ");
If (document. all) {// IE
Obj. fireEvent ("onclick ");
} Else {
Var e = document. createEvent ('mouseevent ');
E. initEvent ('click', false, false );
Obj. dispatchEvent (e );
}
}
// --> </Script>
<Input type = "button" value = "btn1" id = "btn1" onclick = "alert ('button btn1 click event')"/>
<Input type = "button" value = "trigger onclick event with ID btn1" onclick = "handerToClick ()"/>
9. In IE, the event object has the srcElement attribute, and in Firefox, the event object has the target attribute.
Var obj = e. srcElement? E. srcElement: e.tar get; // e is the parameter passed in by the event object.
// The tests below are not available
10. attributes defined in FF must be obtained by getAttribute ().
11. node Problems
IE uses parentElement parement. children, and FF uses parentNode. childNodes
ChildNodes has different meanings in IE and FF. FF inserts blank text nodes in childNodes using DOM standards.
The node in FF does not have the removeNode method. You must use the following method: node. parentNode. removeChild (node)