Javascript differences between Firefox and IE

Document. Form. item:

Many statements such as document. formname. Item ("itemname") exist in the existing code and cannot be run in Firefox.

Solution:

Use document. formname. elements ["elementname"].

Collection object problems:

In the existing Code, many collection class objects are used (), which is acceptable to IE and cannot be used by Firefox.

Solution:

Use [] as the subscript operation. For example, change document. Forms ("formname") to document. Forms ["formname"].

For example, change document. getelementsbyname ("inputname") (1) to document. getelementsbyname ("inputname") [1]

Window. event:

Windows. event cannot be run on Firefox.

Solution:

Mf events can only be used in the event. This problem cannot be solved. This can be changed as follows:

Original code (run in IE): <input type = "button" name = "somebutton" value = "Submit" onclick = "javascript: gotosubmit ()"/>

<Script language = "JavaScript">
Function gotosubmit (){

Alert (window. Event); // use window. Event

}
</SCRIPT> New Code (run in IE and MF): <input type = "button" name = "somebutton" value = "Submit" onclick = "javascript: gotosubmit (event) "/>

<Script language = "JavaScript">
Function gotosubmit (EVT ){
EVT = EVT? EVT: (window. event? Window. Event: NULL );

Alert (EVT); // use EVT

}
</SCRIPT>

In addition, if the first line of the new Code is not modified, it is the same as the old code (that is, the gotosubmit call does not provide a parameter), it can only be run in IE, but no error occurs. Therefore, the TPL part of this solution is still compatible with the old code.

The problem of using the HTML Object ID as the object name is as follows:

In ie, the ID of the HTML object can be directly used as the variable name of the subordinate object of the document. Not in Firefox.

Solution:

Use getelementbyid ("idname") instead of idname as the object variable.

The problem of getting an object using the idname string is as follows:

In IE, Eval (idname) can be used to obtain the HTML object with ID as idname, which cannot be used in MF.

Solution:

Use getelementbyid (idname) instead of eval (idname ).

The variable name is the same as the ID of an HTML object:

In MF, because the Object ID is not the name of the HTML object, you can use the same variable name as the HTML Object ID, which cannot be used in IE.

Solution:

When declaring variables, add VaR to avoid ambiguity, so that it can run normally in IE.

In addition, it is best not to take the same variable name as the HTML Object ID to reduce errors.

Existing Problems with event. X and event. Y:

In ie, the event object has the X and Y attributes, and MF does not.

Solution:

In MF, event. X is equivalent to event. pagex. But event. pagex IE does not. Therefore, event. clientx is used instead of event. X. This variable is also available in IE. Event. clientx is slightly different from event. pagex (when the page has a scroll bar), but most of the time it is equivalent. If it is the same, it may be a little troublesome:
MX = event. X? Event. X: event. pagex;
Use MX instead of event. X.

Others: event. layerx is available in both IE and MF. The significance of event. layerx has not been tested yet.

Pay attention to the differences between x and y in CSS, which may not be supported in Firefox. For example, backgroundpositionx and backgroundpositiony Firefox are not supported.

 

Existing frame problems:

In ie, the frame can be obtained using window. testframe, but not in MF.

Solution:

The main difference between MF and IE in frame usage is that if the following attributes are written in the frame tag:
<Frame src = "xx.htm" id = "frameid" name = "framename"/>
Then Ie can access the window object corresponding to this frame through ID or name. MF can only access the window object corresponding to this frame through name. For example, if the above frame label is written in the HTM in the top window, you can access it as follows:
IE: window. Top. frameid or window. Top. framename to access this window object
Mf: only window. Top. framename can access this window object.

In addition, both mfand iecan use javasdesktop.doc ument. getelementbyid ("frameid") to access the frame tag. In addition, you can switch the frame content by using the parameter top.doc ument. getelementbyid ("testframe"). src = 'xx.htm. You can also switch the frame content through window. Top. framename. Location = 'xx.htm. For the description of frame and window, see the 'window and framework' article in BBS. And the tests under the/test/JS/test_frame/directory.

Custom Attributes

In MF, the defined attributes must be obtained by getattribute ().

Parentelement parement. Children

There is no parentelement parement. Children in MF. Parentnode. childnodes is used.

Childnodes has different meanings in IE and MF. MF uses Dom specifications, and blank text nodes are inserted in childnodes. You can avoid this problem by using node. getelementsbytagname. When a node in HTML is missing, ie and MF have different interpretations of parentnode, for example:

<Form> <Table> <input/> </table> </form>

In MF, the value of input. parentnode is form, while that of input. parentnode in IE is empty. The node in MF does not have the removenode method. You must use the following method: node. parentnode. removechild (node ).

Const problems:

You cannot use the const keyword in IE. For example, const constvar = 32; in IE, This Is A syntax error.

Solution:

Use VaR instead of Const.

Body object

The MF body exists before the body tag is fully read by the browser, While IE exists only after the body is fully read.

Existing Problems with URL encoding:

In JS, if the URL is written, write directly & do not write & for example, VAR url = 'xx. jsp? Objectname = XX & objectevent = XXX ';

If frm. Action = URL, it is very likely that the URL will not be properly displayed so that the parameter is not correctly transmitted to the server. In general, the server reports that the error parameter is not found. Of course, if it is an exception in TPL, because TPL complies with the XML specification and requires & writing as & generally, MF cannot identify &

Nodename and tagname problems:

In MF, all nodes have a nodename value, but textnode does not have a tagname value. In IE, nodename usage seems to be problematic (I have not tested it but I have already died several times ).

Solution:

Use tagname, but check whether it is empty.

Element attributes

The input. Type attribute in IE is read-only, but can be modified in MF.

Document. getelementsbyname () and document. All [name] Problems

In IE, neither getelementsbyname () nor document. All [name] can be used to obtain the DIV element (whether there are other elements that cannot be retrieved is unknown ).

Solution:

 

Object problem: existing issues with form objects:

The existing code obtains the form object through document. Forms ("formname"), which is acceptable in IE and not in MF.

Solution:

Use as subscript. Change to document. Forms ["formname"]
Note: In the subscript calculation, formname is ID and name.

Object Problems: Existing Problems with HTML objects:

In ie, the ID of the HTML object can be directly used as the variable name of the subordinate object of the document. It cannot be in MF. Document. All ("itemname") or document. All ("Itemid ")

Solution:

Use the Object ID as the object variable name document. getelementbyid ("Itemid ")
Note: Document. All is an ie-defined method, so try not to use it. There is also a way to use both IE and MF:
VaR F = Document. Forms ["formname"];
VaR o = f. Itemid;

Object problem: Existing Problem of Div object:

In ie, the DIV object can use ID directly as the object variable name. It cannot be in MF. For example, divid. style. Display = "NONE"

Solution:

Document. getelementbyid ("divid"). style. Display = "NONE"

Object problem: Existing frame problems:

In ie, the frame can be obtained using window. testframe, but not in MF.

Solution:

The main difference between MF and IE in frame usage is that if the following attributes are written in the frame tag:
<Frame src = "xx.htm" id = "frameid" name = "framename"/> Ie can access the window object corresponding to the frame by ID or name, MF can only access the window object corresponding to this frame through name. For example, if the above frame label is written in the HTM in the top window, you can access it as follows:
IE: window. Top. frameid or window. Top. framename to access this window object
Mf: only window. Top. framename can access this window object.
In addition, you can use zookeeper top.doc ument in both mfand ie. getelementbyid ("frameid" is used to define the frametag, and you can use the parameter top.doc ument. getelementbyid ("testframe "). src = 'xx.htm' to switch the frame content, you can also use window. top. framename. location = 'xx.htm' to switch the frame content.

Object problem: Existing window problem:

In IE, you can use showmodaldialog and showmodelessdialog to open modal and non-modal windows, but MF does not.

Solution:

Use window. Open (pageurl, name, parameters) to open a new window. If you want to pass parameters, you can use frame or IFRAME.

Summary

When defining various object variable names in JS, use ID whenever possible to avoid using name. In ie, the ID of the HTML object can be directly used as the variable name of the subordinate object of the document. It cannot be used in MF. Therefore, use ID whenever possible to avoid using only name instead of ID.

The variable name is the same as the ID of an HTML object:

In MF, because the Object ID is not the name of the HTML object, you can use the same variable name as the HTML Object ID, which cannot be used in IE.

Solution:

When declaring variables, add VaR to avoid ambiguity, so that it can run normally in IE. In addition, it is best not to take the same variable name as the HTML Object ID to reduce errors.

Document. All

Firefox is compatible with document. All, but generates a warning. You can use getelementbyid ("*") or getelementbytagname ("*) instead. However, attributes such as document. All. length are completely incompatible.

Parentelement

This is also incompatible. For example, obj. parentelement. name should be changed to OBJ. parentnode. Attributes. getnameditem ("name"). nodevalue (I don't know how to write it more concisely)

Event

W3C does not support windows. for example, in IE: <Div class = "menu" id = "menu" onclick = "onmenuclick ();"> ..... </div>
Function onmenuclick ()
{
Collapsemenu (event. srcelement );
}
Working properly. But in Firefox, it is changed:
<Div class = "menu" id = "menu" onclick = "onmenuclick (event);">
Function onmenuclick (EVT)
{
If (EVT = NULL)
EVT = Window. event; // for IE
VaR srcelement = EVT. srcelement? EVT. srcelement: evt.tar get; // ie uses srcelement, while Firefox uses target
Collapsemenu (srcelement );
}

Innertext:

Supported by IE, not supported by Firefox

Solution:

Innerhtml is used. Both browsers recognize innerhtml.

Document. createelement:

Supported by Firefox (except IE, supported by all browsers now), not by IE

Solution:

No need to setattribute ('style', 'color: red ')
Use object.style.css text = 'color: red; '(this is also an exception)

Existing class problems:

Setattribute ('class', 'styleclass') supported by Firefox and not supported by IE (the specified attribute name is class, and IE does not set the class attribute of the element, on the contrary, ie automatically identifies the classname attribute only when setattribute is used)

Solution:

Setattribute ('class', 'styleclass ')
Setattribute ('classname', 'styleclass ')

Existing Problems with setting events using setattribute:

VaR OBJ = Document. getelementbyid ('objid ');
OBJ. setattribute ('onclick', 'funcitonname (); '); supported by Firefox, not supported by IE

Solution:

In IE, you must use the vertex method to reference the required event handler, and use the following anonymous function: var OBJ = Document. getelementbyid ('objid ');
OBJ. onclick = function () {fucntionname () ;}; this method is supported by all browsers.

Create a radio button

Browsers other than IE:
VaR rdo = Document. createelement ('input ');
Rdo. setattribute ('type', 'Radio ');
Rdo. setattribute ('name', 'radiobtn ');
Rdo. setattribute ('value', 'checked ');

Common skills

When an input element is dynamically created, it is generally first added and then set the type. This may cause errors. Should:
VaR BTN = Document. createelement ('input ');
BTN. setattribut ('type', 'click ');
Document. getelementbyid ('formid '). appendchild (BTN );