JS differs in IE and Firefox.

1. Document. Form. Item Problems

Problem:

ExistingCodeThere are many statements such as document. formname. Item ("itemname") and cannot be run in Firefox.

Solution:

Use document. formname. elements ["elementname"]

2. Collection class Object Problems

Problem:

In IE, you can use () or [] to obtain collection class objects. In Firefox, you can only use [] to obtain collection class objects.

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]

3. Event

Problem about getting event:

Window. event can only be run in IE, but not in Firefox, because Firefox Event can only be used in the event.

Solution:

In ie, the event object cannot be passed to the event for processing as a parameter.Program, You can only use window. event or event to reference the event object.

How to get the event in Firefox:

(1) passing the parameter event from the HTML page

(2) event = arguments. callee. Caller. Arguments [0];

Function getevent (EVT) {EVT = EVT? EVT :( window. event? Window. Event: NULL );}

Event attribute problems:

In ie, the event object has the properties X and Y, but does not have the pagex and Pagey attributes. In Firefox, the event object has the pagex and Pagey attributes, but does not have the properties X and Y.

The event. pagex in Firefox is equivalent to the event. X in IE.

Solution:Event. x = event. X? Event. X: event. pagex;

Others:

Event. layerx is available in both IE and Firefox. There is no difference in the specific significance of this feature.

4. Question about the ID of an HTML object as the object name

Problem:

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

Solution:

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

5. The problem of getting an object using the idname string

Problem:

In IE, you can use eval (idname) to obtain the HTML object with ID as idname, but not in Firefox.

Solution:

Use getelementbyid (idname) instead of eval (idname)

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

Problem:

In ie, the ID of the HTML object can be directly used as the variable name of the subordinate object of the document, while in Firefox, the ID cannot. In Firefox, use the same variable name as the HTML Object ID; in IE, no.

Solution:

Use document. getelementbyid ("idname") instead of document. idname

When declaring variables, add VaR to avoid ambiguity.

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

7. Frame Problems

Problem:

You can use window. testframe to obtain the frame in IE, but not in Firefox.

Solution:

The main difference between Firefox and IE in frame usage is:

<Frame src = "xx.htm" id = "frameid" name = "framename"/>

Ie can access the window object corresponding to this frame through ID or name

Firefox can only access the window object corresponding to this frame through name.

If the above frame label is written in the HTM in the top window, you can access

IE: window. Top. frameid or window. Top. framename to access this window object

Firefox: only window. Top. framename can access this window object.

In addition, you can use tranquility top.doc ument. getelementbyid ("frameid") to access the frame tag in Firefox and ie.

In addition, you can switch the frame content through the parameter top.doc ument. getelementbyid ("testframe"). src = 'xx.htm '.

You can also switch the frame content through window. Top. framename. Location = 'xx.htm '.

9. In Firefox, attributes defined by myself must be obtained by getattribute ().

If (document. All) {// Add an event for the DLG object in IE
DLG. setattribute ("onmousedown", function () {move_div (this );});
} Else {// Add an event for the DLG object in Firefox
DLG. setattribute ("onmousedown", "move_div (this );");
}

10. Use parentnode childnodes instead of parentelement children in Firefox

Childnodes has different meanings in IE and Firefox. Firefox uses the DOM specification, blank text nodes will be inserted in childnodes. In Firefox, childnodes counts line breaks and white spaces as child nodes of the parent node,

But IE's childnodes and children won't.

You can avoid this problem by using node. getelementsbytagname.

When a node in HTML is missing, ie and Firefox have different interpretations of parentnode, for example

<Form>

<Table>

<Input/>

</Table>

</Form>

In Firefox, the value of input. parentnode is form, while that of input. parentnode in IE is empty.

The node in Firefox does not have the removenode method. You must use the following method: node. parentnode. removechild (node)

11. Const Problems

Problem:

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

Method:

Use VaR instead of Const.

12. Body object

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

13. url Encoding

In JS, if you write a URL, write it directly & do not use & amp;

If var url = 'xx. jsp? Objectname = XX & amp; objectevent = XXX ';

When frm. Action = URL is used, the URL may not be properly displayed so that the parameter is not correctly transmitted to the server. Generally, the server reports an error and the parameter is not found.

Of course, this is an exception in TPL, because TPL complies with XML specifications and requires & writing as & amp;

Generally, Firefox cannot identify & amp;

14. nodename and tagname Problems

Problem:

In Firefox, all nodes have a nodename value, but textnode does not have a tagname value. In IE, nodename usage seems to be faulty.

Solution:

Use tagname, but check whether it is empty.

15. Question about the input. Type attribute

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

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

Problem:

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 ).

17. event. srcelement Problems

Problem: in IE, the even object has the srcelement attribute, but does not have the target attribute. In Firefox, the even object has the target attribute, but does not have the srcelement attribute.

Solution: Use OBJ (OBJ = event. srcelement? Event. srcelement: event.targettoken to replace event.tar get under firefoxin event.srcelement.pdf

18. Modal and non-modal window Problems

Problem: in IE, you can open modal and non-modal windows through showmodaldialog and showmodelessdialog; in Firefox, no.

Solution:

Use window. Open (pageurl, name, parameters) to open a new window. If you want to pass the parameters in the Child window back to the parent window, you can use window. opener in the Child Window to access the parent window.

Example: var parentwin = Window. opener;

Parentwin.doc ument. getelementbyid ("aqing"). value = "aqing ";

19. Event delegation Method

IE: Document. Body. onload = inject; // function inject () has been implemented before this
Firefox: Document. Body. onload = inject ();
Some people say the standard is: Document. Body. onload = new function ('inject ()');

20. Differences between Firefox and IE (parentelement) parent Elements

IE: obj. parentelement
Firefox: obj. parentnode
Solution: because both Firefox and IE support DOM, using obj. parentnode is a good choice.

21. cursor: hand vs cursor: pointer

Firefox does not support hand, But ie supports pointer
Solution:Use Pointer in a unified manner

22. innertext works normally in IE, but innertext does not work in Firefox.

Solution:
If (navigator. appname. indexof ("Explorer")>-1 ){

Document. getelementbyid ('element'). innertext = "My text ";

} Else {

Document. getelementbyid ('element'). textcontent = "My text ";

}

23. The statement similar to OBJ. style. Height = imgobj. Height in Firefox is invalid.

Solution:OBJ. style. Height = imgobj. height + 'px ';

 

24. IE, Firefox, and other browsers have different operations on table labels. in IE, assigning values to innerhtml of table and TR is not allowed. When adding a Tr using JS, the appendchile method does not work.

Solution:// Append an empty row to the table
VaR ROW = otable. insertrow (-1 );
VaR cell = Document. createelement ("TD ");
Cell. innerhtml = "";
Cell. classname = "XXXX ";
Row. appendchild (cell );

25. Padding Problems

Firefox cannot describe the abbreviation of padding 5px 4px 3px 1px. It must be changed to padding-top: 5px; padding-Right: 4px; padding-bottom: 3px; padding-left: 1px;

26. When the indentation of UL and ol lists is eliminated

Style should be written as: List-style: none; margin: 0px; padding: 0px;
The margin attribute is valid for IE and the padding attribute is valid for Firefox.

27. Transparent CSS

IE: filter: progid: DXImageTransform. Microsoft. Alpha (style = 0, opacity = 60)
Firefox: opacity: 0.6

28. CSS rounded corners

IE: rounded corners are not supported.
Firefox:-moz-border-radius: 4px, or-moz-border-radius-topleft: 4px;-moz-border-radius-topright: 4px; -Moz-border-radius-bottomleft: 4px;

-Moz-border-radius-bottomright: 4px;

29. CSS double-line concave and convex border

IE: Border: 2px outset;
Firefox:-moz-border-top-colors: # d4d0c8 white;-moz-border-left-colors: # d4d0c8 white;-moz-border-right-colors: #404040 #808080;

-Moz-border-bottom-colors: #404040 #808080;

30. Window. Location. href

Problem: in IE or firefox2.0.x, you can use window. Location or window. Location. href; In firefox1.5.x, you can only use window. location.

Solution: Use window. location to replace window. Location. href

31. Close the modal window

Problem: Firefox does not support window. Close ().

Solution: Use window. Top. Close ()