Section 1/2 about developing cross-browser JavaScript methods

Develop cross-browser JavaScript

1. Differences between childNodes and ie in ff.

Node (nodeType = 1) in ff are separated by textNode (nodeType = 3), whereas ie/op is not.

<Div id = "box1"> <span> content </span> </div>

In ff, there are three childNodes in box1 and one in ie.

2. Set the style class Name of a node object.

In ie, you must set the class of a node to set or get with "className" as attr.

Ff and other browsers use "class" as attr to set or get.

Code:

If (typeof node1.getAttribute ("className") = "string "){

.

}

3. Set the style content of a node object.

For example

Code:

Var oStyle = oNode. getAttribute ("style ");

// Ie

If (oStyle = "[object]") {

OStyle. setAttribute ("cssText", strStyle );

ONode. setAttribute ("style", oStyle );

} Else {

ONode. setAttribute ("style", strStyle );

}

4. event object.

Use event for ie

Evnt for ff

5. Event objects

Ie uses objEvent. srcElement

Ffuse objevent.tar get

This is related to xml file writing. Set preserveWhiteSpace of IE to true. The following is a description file from Microsoft.
Code:

Var xmlDoc = new ActiveXObject ("Msxml2.DOMDocument. 4.0 ");

XmlDoc. async = false;

XmlDoc. preserveWhiteSpace = true;

XmlDoc. load ("books. xml ");

Alert (xmlDoc. xml );

XmlDoc. async = false;

XmlDoc. preserveWhiteSpace = false;

XmlDoc. load ("books. xml ");

Alert (xmlDoc. xml );

-----------------------

1. Add rows to the table:

Document. createElement and document. the appendChild method can easily append rows to a table or create a new table with table rows from the beginning: Use document. createElement: Create a table by using document. the appendChild method adds the table cells to the table rows. Next, use document. appendChild adds the table rows to the table.

IE allows the tr element to be added to the tbody, rather than directly added to the table.

<Table id = "myTable">

<Tbody id = "myTableBody"> </tbody>

</Table>

The correct way to Add rows to this table is to add rows to the table body rather than to the table, as shown in the following figure:

Var cell = document. createElement ("td"). appendChild (document. createTextNode ("foo ");

Var row = document. createElement ("tr"). appendChild (cell );

Document. getElementById ("mysqlTableBody"). appendChild (row );

Fortunately, this method is common in all current browsers, including IE. If you get into the habit of using the table body, you don't have to worry about it.

2. Set the style of the element through Javascr transform pt

You can use the setAttribute method of the element to set the style of the element through Javascr transform pt. For example, to modify the text in the span element to be displayed in red bold, you can use the setAttribute method as follows:

Var spanElement = document. getElementById ("mySpan ");

SpanElement. setAttribute ("style", "font-weight: bold; color: red ;");

Except IE, this method works on other browsers. for IE, the solution is to use the cssText attribute of the element style object to set the required style. Although this attribute is not standard, it is widely supported, as shown below:

Var spanElement = document. getElementById ("mySpan ");

SpanElement.style.css Text = "font-weight: blod; color: red ;";

This method works well on IE and most other browsers, except Opera. To make the code portable on all current browsers, you can use both methods, that is, the setAttribute method and the cssText attribute of the style object, as shown below:

Var spanElement = document. getElementById ("mySpan ");

SpanElement. setAttribute ("style", "font-weight: bold; color: red ;");

SpanElement.style.css Text = "font-weight: blod; color: red ;";