brief introduction

  • node (node) Is a network term , It represents a connection point in the network . A network is a collection of nodes .
  • stay DOM in , A document is a collection of nodes , At this time, the nodes are branches and leaves on the document tree .


DOM Contains many different types of nodes , Let's introduce three of them : Element nodes 、 Text nodes and attribute nodes .

1. Element nodes

explain :DOM The atom of is an element node .


  • The name of the element is the name of the tag .example: The name of the text paragraph element is “p”.
  • Element can contain other elements .example: stay html In file ,\ The element is the root element of the node tree , Other elements , for example head、body etc. , Are contained in the root element .

2. Text node

explain : Text nodes are always contained within element nodes , Its content is text . But it can't be said that all element nodes contain text nodes .


<p>This is an example.</p>

Above <p> In the elements ,“This is an example.” It's just a text node .

3. Attribute node

explain : The attribute node is used to make a more specific description of the element .


</p><p title="an example title">This is an example.</p>

Above <p> In the elements , We can use title Property to describe this </p>

Elements .

stay DOM in ,title="an example title" Is an attribute node .

Be careful

  • Attribute nodes are always placed in the start tag , That is, attribute nodes are always contained in element nodes .

  • But not all elements contain attributes , But all the attributes are contained in the element .

Reference books :《JavaScript DOM Programming art 》

JavaScript-DOM- More related articles on node introduction and classification

  1. javascript DOM node The first 18 section

    <html> <head> <title>DOM object </title> </head><body><div >DOM Yes ...

  2. JavaScript DOM&ndash; Node operation

    node Nodes have at least nodeType( Node type ).nodeName( The name of the node ) and nodeValue( Node values ) These three basic attributes . Element nodes nodeType  by 1 Attribute node nodeType  by 2 Text ...

  3. JavaScript DOM Node and document type

    The following example is based on HTML Take the document structure as an example : <!DOCTYPE html> <html lang="en"> <head> <meta char ...

  4. JavaScript DOM Node operation summary

    Node type There are three types of nodes : Element nodes , Attribute nodes and text nodes . And yes DOM It is mainly about the addition, deletion, modification and query of element nodes and attribute nodes . The following describes the operations on element nodes and attribute nodes respectively . Element nodes check In the face of DOM Into the ...

  5. javascript DOM node

    How to obtain child nodes : 1. Treat the text content as a node childNodes firstChild lastChild 2. Get the node labeled content children firstElementChild lastEl ...

  6. console.time Simple analysis javascript Dynamic join Dom Node performance

    Bullshit I wanted to update my blog every day , But there will be an exam in the near future , Also has is oneself still stays in secretly secretly secretly joyful ( This idea needs to change ). In fact, I've been thinking about . How to manage your own data , Every day's life is to add, delete, check and modify their own data ...

  7. JavaScript obtain HTML DOM Details of node elements ( turn )

    stay Web Using procedures, especially Web 2.0 Program development , Always get an element in the page , Then update the style of the element . Content, etc. . How to get the element to update , It's the first question to deal with . 51CTO Recommended reading :JavaScript DOM file ...

  8. Javascript Advanced ——(DOM— node --- attribute 、 Access to the node )— Take notes

    Node properties in the document object model (DOM) in , Each node is an object .DOM Nodes have three important attributes : 1. nodeName : Name of node 2. nodeValue : The value of the node 3. nodeType : ...

  9. JavaScript Learning notes ( 3、 ... and )—— Message board knows how to manipulate DOM node

    use JavaScript Wrote a simple message board , Database access is not involved . 1. Functions and processes The main function is to leave a message , Use two text boxes to accept the user's user name and message content , And then through " Submit message " The button will push the user ...

  10. JavaScript operation DOM node

    DOM ( Document object model (Document Object Model)) Document object model (Document Object Model, abbreviation DOM), yes W3C Organization recommended standard programming interface for handling extensible markup language . Online ...

Random recommendation

  1. ordinary VC++ ADO Helper classes

    First look at the header file #pragma once #import "c:\Program Files\Common Files\System\ado\msado15.dll" no_name ...

  2. Thorough understanding android Internal storage and external storage

    Let's first consider such a problem : Turn on the phone settings , Choose application management , Choose any one App, And then you'll see two buttons , One is to clear the cache , The other is to clear the data , So when we click clear cache, where data is cleared ? When we click clear data ...

  3. Simple interest Compound calculator program 1.0 2.0 3.0 [ close ] And C Language

    This program uses C Language writing ~~~ 1. Calculation : Principal is 100 ten thousand , The interest rate or return on investment is 3%, The investment period is 30 year , that ,30 Interest income after the year : According to the formula of compound interest, that is :1,000,000×(1+3%)^30 1 v ...

  4. Lambda Action Func practice

    namespace lambda { delegate void TestDelegate(string s); class Program { static void Main(string[] a ...

  5. Put this to use : Give Way visualstudio Fall in love with sublime

    Preface : Often in vs Work in China , But some editors like it very much sublime The way , If you are , Let's be a matchmaker , ha-ha . Get ready :       Visualstudio One        Sublime One   ...

  6. BP The basic principles of neural networks

    2.1 BP The basic principles of neural networks BP The basic principle of network model processing information is : Input signal Xi Through the middle node ( Hidden layer point ) Acting on the output node , After a non-linear transformation , Produce an output signal Yk, Each sample of network training contains input vectors X And the expected output t, network ...

  7. Win8.1 Asynchronous programming of application development

    stay win8 App Store Development , We'll come across a lot of asynchronous methods . They're there to make sure your application responds well to tasks that take a lot of time to run , That is to say, calling asynchronously API In response to user actions . Imagine we click on a But ...

  8. Java Back end development

    I excerpt from the article of white clothes in Jiangnan , Article address : Bookshelves are mainly for Java The backend development . 3.0 I bought some later ...

  9. Find the minimum spanning tree ——Kruskal Algorithm

    Given an undirected graph with weights , The spanning tree that requires the minimum sum of weights , Common algorithms are Kruskal Algorithm and Prim Algorithm . This article first introduces Kruskal Algorithm . Kruskal The basic idea of algorithm : First, all edges are sorted by weight from small to large , Then press clockwise ...

  10. nginx To configure open_cache_file Cache of static files

    open_file_cache max=65535 inactive=30s How many files to cache at most , How long to cache open_file_cache_min_uses 1 stay 30S The number of times this configuration is not used in ...