DOM objects in Ajax

Source: Internet
Author: User
1. getelementbyid (ID)

Access an element through the element ID. This is a basic DOM method for accessing the page element, which is frequently used.

For example, in the following example, we can quickly access it with the ID of the DIV, instead of having to traverse it through the DOM layer by layer,

H

Just for testing;

Just for testing;


Note that when using this function, if the element ID is not unique, the first qualified element will be obtained.
In IE6, if the input, checkbox, radio. And other element names match the specified ID
In the following example, the obtained element is input:

Just for testing;


2. getelementsbyname (name)
The array of elements whose names are name is returned. If the element ID matches this name in IE6, this element will also be included, and getelementsbyname () is only used for input, radio, checkbox and other element objects.
In the following example, the length of the Georges array is 0.

FF


3. getelementsbytagname (tagname)
Getelementbytagname can be used for document or element. Getelementsbytagname returns the list of child elements (arrays) with the specified tagname ). You can traverse this array to obtain each individual sub-element. When processing a large Dom structure, this method can be easily used to narrow down the scope.

Hi

Hello

Common Dom Element Methods
1. appendchild (node)
Append a node to the current node object. It is often used to dynamically add content to pages.

For example, add a text node to the DIV:

In the preceding example, add text to the DIV, or use newdiv. innerhtml = "A New Div,

However, innerhtml does not belong to Dom.

2. removechild (childreference)
Remove the child node of the current node and return the removed node. The removed node can be inserted somewhere else in the document tree.

A child

3. clonenode (deepboolean)

Copy and return the copy node of the current node. The copied node is an isolated node, not in the document tree. Copy the attribute value of the original node, including the ID attribute. Therefore, before adding the new node to the document, you must modify the ID attribute to keep it unique. Of course, if the uniqueness of the ID is not important, you can leave it alone.

This method supports a Boolean parameter. When deepboolean is set to true, all subnodes of the current node are copied, including the text in the node.

11111

P = Document. getelementbyid ("mypara ")

Pclone = P. clonenode (true );

P. parentnode. appendchild (pclone );

4. replaceChild (newchild, oldchild)
Replace one subnode of the current node with another node.
For example:

Span


5. insertbefore (newelement, targetelement)
Insert a new node to the current node. If the targetelement is set to null, the new node is inserted as the last subnode. Otherwise, the new node should be inserted to the nearest node before the targetelement.

Bear's paw, and I love it too!

6. Click ()
One click of the execution element, which can be used to trigger the onclick function through the script

Hhh

Attributes of Dom element: (The following are commonly used. For ie5.0 and later versions, mozllia supports)

1. childenodes returns all child node objects,

For example

A monk has water to drink.
Two monks pick up water.
Three monks have no water to drink.

2. innerhtml
This is a de facto standard, not W3C Dom, but almost all browsers that support DOM support this attribute. Through this attribute, we can easily modify the HTML of an element.

New humans, what ?!

3. Style
Returns a reference to the style object of an element. With this, we can obtain and modify each individual style.

For example, the following script can modify the background color of an element.

Document. getelementbyid ("test"). style. backgroundcolor = "yellow"

4. firstchild returns the first subnode
5. lastchild returns the last subnode.
6. parentnode returns the object of the parent node.
7. nextsibling returns the object of the next sibling node.
8. previussibling returns the object of the previous sibling node.
9. nodename: return the node's HTML Tag name, which must contain uppercase letters, such as P and font.

For example

Ddd

Example 1:
Use dom1.0 JavaScript to dynamically create an HTML table.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.