JS of IE, Firefox, and chromeCodeCompatibility considerations
Jangogo @ 2009-6-26 12:03:00
Recently, the company's 4 FangSifangSifangBecause online software products are widely praised by more users, the company decided to only support IE and expand to support Firefox and chrome. The Walkman version decided to use chrome as the client, when upgrading code compatibility, I encountered some problems. Let's record them for reference by colleagues and friends.
1. If XMLHTTP of IE requests a non-XML file, xmlhttpobject. responsexml is an available object.
Firefox and chrome return null.
IE, we can use xmlhttpobject. responsexml. loadxml, Firefox and chrome through other methods.
- VaRXx = getxmlhttpobj ();
-
- VaRTEXT = XX. responsetext. replaceall ('&','&');
-
- VaRXD = XX. responsexml;
-
- If(Xd ){
-
- XD. loadxml (text );
- }Else{
-
- VaROparser =NewDomparser ();
-
- XD = oparser. parsefromstring (text,"Text/XML");
-
- // Alert (XD. getelementsbytagname (""));
- }
2. xmlhttpobject. IE and chrome support the xmlhttpobject. Send () method without any parameters. Firefox must require at least one parameter, even if the parameter value is null, that is:
- // To be compatible with multiple browsers, you must write this statement. The parameter null cannot be omitted:
- Xmlhttpobject. Send (Null);
3. In Firefox, The htmlelementobject. outerhtml attribute is invalid, and IE and chrome are normal. For example, we want to delete a div:
- // This statement works well in IE and chrome.
- $ ("Div"). Outerhtml ="";// Delete a div
- // Firefox cannot be implemented through the preceding statement. It can only be implemented through the following methods:
- $ ("Div"). Parentnode. removechild ($ ("Div"));
- Delete$ ("Div"+ N );
4. firfox does not support obtaining this element directly with the ID of htmlelementobject. IE and chrome support this element well.
Is firfox rigid in adhering to the "standard "?!
For example, there is an HTML code on our page:
- <Div ID="Divobj">This is some text</Div>
IE and chrome can directly use divobj to reference this element object.
Firfox can only use the getelementbyid ('divobj ') or the famous $ ('divobj') function.
5. Use JavaScript to operate stylesheet objects and rules objects. The compatible syntax is as follows:
- var rules = document. getelementbyid ( "xwincss" ). sheet | document. stylesheets [ "xwincss" ];
- If (rules. Rules) {
- // ie
- rules = rules. Rules;
- } else {
- // firefox
- rulesw.rules.css rules;
- }
6. Firefox and IE event handling
In IE, event objects are saved and maintained as global variables. All browser events, whether triggered by users
Or other events will update the window. event object. Therefore, in the code, you only need to easily call window. Event
You can easily get the event object, and then event. srcelement can get the element that triggers the event for further processing.
In ff, the event object is not a global object. Generally, it occurs on site and is used on site. FF automatically transmits the event object
To the corresponding event processing function. In the code, the first parameter of the function is the event object under ff.
-
- // <Button id = "btn4" onclick = "foo4 ()"> button 4 </button>
-
- FunctionFoo4 (){
-
- VaREVT = getevent ();
-
- VaRElement = EVT. srcelement | evt.tar get;
-
- Alert (element. ID)
-
- }
- FunctionGetevent ()
-
- {// Compatible with both IE and FF
-
- If(Document. All)ReturnWindow. event;
-
- Func = getevent. Caller;
-
- While(Func! =Null){
-
- VaRArg0 = func. Arguments [0];
-
- If(Arg0 ){
- If(Arg0.constructor = event | arg0.constructor = mouseevent) | (Typeof(Arg0) ="Object"& Arg0.preventdefault & arg0.stoppropagation )){
-
- ReturnArg0;
-
- }
-
- }
-
- Func = func. Caller;
-
- }
-
- Return Null;
-
- }
7. Firefox and IE rival pointers are incompatible with cursor.
hand pointers are written in cursor: Hand and cursor: pointer: hand is not supported in ff. An error is returned!
you only need to use cursor: pointer. Both ff and IE support this function!