Understanding of ELEMENT nodes, attribute nodes, text nodes in the DOM 13.3

Source: Internet
Author: User

Node information

Each node has properties that contain some information about the node. These properties are:
NodeName (node name)
NodeValue (node value)
NodeType (node type)
NodeType

The NodeType property returns the type of the node.

The most important node types are:

Element type

Node type

Element (Element_node)

1

Properties (Attribute_node)

2

Text (Text_node)

3

Note (comment_node)

8

Document (Document_node)

9

In the actual application, is often used is the element node, attribute node and text node, below we through the small section code to explain

1: Element node
ELEMENT Node code

  1. <HTML>
  2. <HEAD>
  3. <title> Empty Valley leisurely </title>
  4. </HEAD>
  5. <BODY>
  6. <table>
  7. <tr>
  8. <TD Id="John" name="myname">john</td>
  9. <TD>doe</td>
  10. <TD Id="Jack">jack</td>
  11. </tr>
  12. </Table>
  13. <script>
  14. var d = document.getElementById ("John");
  15. Alert (D.nodetype)
  16. Alert (D.nodename)
  17. Alert (D.nodevalue)
  18. </Script>
  19. </BODY>
  20. </HTML>


Analyze the result of the run with the values of the three properties:

Nodetype:element_node

NodeType Value: 1

NodeName: Element tag name//here is TD

Nodevalue:null

2: Attribute node


Attribute Node code

  1. <HTML>
  2. <HEAD>
  3. <title> Empty Valley leisurely </title>
  4. </HEAD>
  5. <BODY>
  6. <table>
  7. <tr>
  8. <TD Id="John" name="myname">john</td>
  9. <TD>doe</td>
  10. <TD Id="Jack">jack</td>
  11. </tr>
  12. </Table>
  13. <script>
  14. var d = document.getElementById ("John"). GetAttributeNode ("name");
  15. Alert (D.nodetype)
  16. Alert (D.nodename)
  17. Alert (D.nodevalue)
  18. </Script>
  19. </BODY>
  20. </HTML>


Analyze the result of the run with the values of the three properties:

Nodetype:attribute_node

NodeType Value: 2

NodeName: Attribute name//name

NodeValue: Attribute value//myname

3: Text node


Text Node code

  1. <HTML>
  2. <HEAD>
  3. <title>new Document</title>
  4. </HEAD>
  5. <BODY>
  6. <table>
  7. <tr>
  8. <TD Id="John" name="myname">john</td>
  9. <TD>doe</td>
  10. <TD Id="Jack">jack</td>
  11. </tr>
  12. </Table>
  13. <script>
  14. var d = document.getelementsbytagname ("TD") [0].firstchild
  15. Alert (D.nodetype)
  16. Alert (D.nodename)
  17. Alert (D.nodevalue)
  18. </Script>
  19. </BODY>
  20. </HTML>


Analyze the result of the run with the values of the three properties:

Nodetype:text_node

NodeType Value: 3

NodeName: #text

NodeValue: Text content//John

Understanding of ELEMENT nodes, attribute nodes, text nodes in the DOM 13.3

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.