Document. createElement () usage and precautions (incompatible with ff)

Today, I handled the compatibility problem of ie and ff for a date selector. It was difficult to find an error in this case. After a long time, I found the error and found the method document for creating elements in js. createElement (). This method supports the creation of elements in ie.

Copy codeThe Code is as follows: var inputObj = document. createElement
("<Input type = 'text' size = '8' style = 'border: 0px; border-bottom: 2px solid # c0c0c0; '" readonly> ");

However, this is incompatible with ff.
Also, pay special attention to the creation of input elements: there are many elements related to input, such as checkbox, radio, submit, reset.... Therefore, it is a special usage to create input.

The correct method to create different inputs is:

Copy codeThe Code is as follows: <div id = "board"> </div>
<Script type = "text/javascript">
<! --
Var board = document. getElementById ("board ");
Var e = document. createElement ("input ");
E. type = "radio"; // followed by the previous line
Var obj = board. appendChild (e );
Obj. checked = true;
// The following statement is correct:
// E. checked = true;
-->
</Script>

For input, e. type in Netscape, Opera, and Firefox can be before or after appendChild. However, in IE, the type attribute must be in the front, and other attributes must be in the back.

Another feature of IE creation elements is that they can be created together with attributes, such as var e = document. createElement ("<input type = 'Radio 'name = 'r' value = '1'/>"); this is not supported in other browsers.

Summary:

• For non-input elements, each browser can write changes to the element attributes before the display element (insertBefore or appendChild) or after it.
• For input elements, for IE compatibility, the type attribute is written before the display element (insertBefore or appendChild), and other attributes are written after it.
Recommended:

• Except that the type attribute of the input element is written before the display element (insertBefore or appendChild), other attributes are written after the display element.
• When changing attributes, the return value of createElement is used before the display element (insertBefore or appendChild) and the return value of insertBefore or appendChild after the display element.

Copy codeThe Code is as follows: 1.var echkbox = document. createElement ("input ");
2. echkbox. setAttribute ("type", "checkbox ");
3. echkbox. setAttribute ("id", "inputid ");
4. echkbox. setAttribute ("name", "inputname ");
5. echkbox. setAttribute ("value", "inputvalue ");
6. var addhere = document. getElementById ("someElementId ");
7. addhere. appendChild (echkbox );
8. echkbox. setAttribute ("checked", "checked ");
9. alert (document. getElementById ("inputid"). checked );

<! -- Document method:
GetElementById (id) returns the reference of the specified Node
GetElementsByTagName (name) returns the set of all matching elements in the document.
CreateElement (name) creates a new node of the specified type
CreateTextNode (text) creates a plain text node
Element Method:
GetAttribute (id) returns the value of the specified attribute.
SetAttribute (id, value) assigns a value to the attribute
RemoveAttribute (id) removes the specified attribute and its value.
GetElementsByTagName (name) returns the set of all matching elements in the node.
Node Method:
AppendChild (child) adds a new child node to a specified Node
RemoveChild (child) removes the child node of the specified Node
ReplaceChild (newChild, oldChild) replaces the child node of the specified Node
InsertBefore (newChild, refChild) inserts a new node in front of a node at the same level
HasChildNodes () returns true if the node has a subnode.
Node attributes:
NodeName stores the node name in string format
NodeType stores the node type in integer data format
NodeValue stores node values in available formats
References from parentNode to the parent node of the node
ChildNodes refers to the set referenced by the subnode.
FirstChild refers to the reference of the first child node in the child node combination.
Reference of lastChild pointing to the last child node in the child node combination

Dynamic Loading of js

Copy codeThe Code is as follows: var Rash = true;
Var msg = "";
Function norash ()
{
If (confirm ("are you sure you want to cancel "))
Rash = false;
}
Function rashit ()
{
SetInterval ('getrss () ', Inttime );
}
Function getrss ()
{
If (Rash = true)
{
Head = document. getElementsByTagName ('head'). item (0 );
Script = document. createElement ('script ');
Script. src = 'include/AutoUpdate. asp ';
Script. type = 'text/javascript ';
Script. defer = true;
Void (head. appendChild (script ));
Window. status = msg;
}
}
Rashit ();