JavaScript DOM中的Node节点及节点操作

最新推荐文章于 2022-08-13 08:18:42 发布
最新推荐文章于 2022-08-13 08:18:42 发布
阅读量441 收藏 1
点赞数
分类专栏： web前端
JavaScript DOM中的Node节点及节点操作
  在DOM（文档对象模型）中，HTML文档的层次结构被表示为树形结构，HTML文档的树形表示主要包含表示元素或标记的节点和标识文本串的节点构成。在JavaScript DOM中，Node常常被翻译成节点，下面我们通过实例，来了解一下Node的属性及方法。
 

Node的属性介绍：

  1. nodeType：显示节点的类型  
  2. nodeName：显示节点的名称  
  3. nodeValue：显示节点的值  
  4. attributes：获取一个属性节点  
  5. firstChild：表示某一节点的第一个节点  
  6. lastChild：表示某一节点的最后一个子节点  
  7. childNodes：表示所在节点的所有子节点  
  8. parentNode：表示所在节点的父节点  
  9. nextSibling：紧挨着当前节点的下一个节点  
  10. previousSibling：紧挨着当前节点的上一个节点 

Node有各种各样的节点，我们先花一些时间认识他们，同时一并了解nodeType，nodeName和nodeValue属性：

 

节点的nodeType 值可能返回如下属性：

1-ELEMENT //元素节点
2-ATTRIBUTE //属性节点
3-TEXT //文本节点
4-CDATA 
5-ENTITY REFERENCE 
6-ENTITY 
7-PI (processing instruction) 
8-COMMENT 
9-DOCUMENT 
10-DOCUMENT TYPE 
11-DOCUMENT FRAGMENT 
12-NOTATION

名称：元素节点

◆nodeType：ELEMENT_NODE

◆nodeType值：1

◆nodeName：元素标记名

◆nodeValue：null

  1. <body> 
  2. <div id = "t" ><span></span></div> 
  3. </body> 
  4. <script> 
  5. var d = document.getElementById("t");  
  6. document.write(d.nodeType);  
  7. document.write(d.nodeName);  
  8. document.write(d.nodeValue);  
  9. //显示 1 DIV null  
  10. </script> 

名称：属性节点

◆nodeType：ATTRIBUTE_NODE

◆nodeType值：2

◆nodeName：属性名

◆nodeValue：属性值

  1. <body> 
  2. <div id = "t" name="aaa"><span></span></div> 
  3. </body> 
  4. <script> 
  5. var d = document.getElementById("t").getAttributeNode("name");  
  6. document.write(d.nodeType);  
  7. document.write(d.nodeName);  
  8. document.write(d.nodeValue);  
  9. //显示 2 name aaa  
  10. </script> 

名称：文本节点

◆nodeType：TEXT_NODE

◆nodeType值：3

◆nodeName：#text

◆nodeValue：文本内容

  1. <body> 
  2. <div id = "t">bbb</div> 
  3. </body> 
  4. <script> 
  5. var d = document.getElementById("t").firstChild;  
  6. document.write(d.nodeType);  
  7. document.write(d.nodeName);  
  8. document.write(d.nodeValue);  
  9. //显示 3 #text bbb  
  10. </script> 

名称：CDATA文本节点（XML中传递文本的格式）

◆nodeType：CDATA_SECTION_NODE

◆nodeType值：4

◆nodeName：#cdata-section

◆nodeValue：CDATA文本内容

attributes属性，直接获取一个属性节点，注意这里要使用[]，保持IE和FF的兼容性。

  1. <body name="ddd"> 
  2. <div id = "t" name = "aaa"><span>aaa</span><span>bbb</span><span>ccc</span></div> 
  3. </body> 
  4. <script> 
  5. var d = document.getElementById("t").attributes["name"];  
  6. document.write(d.name);  
  7. document.write(d.value);  
  8. //显示 name aaa  
  9. </script> 

firstChild和lastChild属性，表示某一节点的第一个和最后一个子节点：

  1. <body> 
  2. <div id = "t"><span>aaa</span><span>bbb</span><span>ccc</span></div> 
  3. </body> 
  4. <script> 
  5. var d = document.getElementById("t");  
  6. document.write(d.firstChild.innerHTML);  
  7. document.write(d.lastChild.innerHTML);  
  8. //显示 aaa ccc  
  9. </script> 

childNodes和parentNode属性，表示所在节点的所有子节点和所在节点的父节点，这里的childNodes注意是一个数组：

  1. <body name="ddd"> 
  2. <div id = "t"><span>aaa</span><span>bbb</span><span>ccc</span></div> 
  3. </body> 
  4. <script> 
  5. var d = document.getElementById("t");  
  6. document.write(d.childNodes[1].innerHTML);  
  7. document.write(d.parentNode.getAttribute("name"));  
  8. //显示 bbb ddd  
  9. </script> 

nextSibling和previousSibling属性，分别表示在parentNode的childNodes[]数组中，紧挨着当前节点的上一个和下一个节点：

  1. <body name="ddd"> 
  2. <div id = "t"><span>aaa</span><span>bbb</span><span>ccc</span></div> 
  3. </body> 
  4. <script> 
  5. var d = document.getElementById("t").childNodes[1];  
  6. document.write(d.nextSibling.innerHTML);  
  7. document.write(d.previousSibling.innerHTML);  
  8. //显示 ccc aaa  
  9. </script>  

  10. Node的方法介绍：

    ◆hasChildNodes()：判定一个节点是否有子节点

    ◆removeChild()：去除一个节点

    ◆appendChild()：添加一个节点

    ◆replaceChild()：替换一个节点

    ◆insertBefore()：指定节点位置插入一个节点

    ◆cloneNode()：复制一个节点

    ◆normalize()：（不知）

    ◆hasChildNodes()方法：判定一个节点是否有子节点，有返回true，没有返回false

    1. <body name="ddd"> 
    2. <div id = "t"><span>aaa</span><span>bbb</span><span>ccc</span></div> 
    3. <div id = "m"></div> 
    4. </body> 
    5. <script> 
    6. alert(document.getElementById("t").hasChildNodes());  
    7. alert(document.getElementById("m").hasChildNodes());  
    8. // 第一个true，第二个false  
    9. </script> 

    removeChild()方法：去除一个节点：

    1. <body name="ddd"> 
    2. <div id = "t"><span>aaa</span><span>bbb</span><span>ccc</span></div> 
    3. </body> 
    4. <script> 
    5. var d = document.getElementById("t").firstChild;  
    6. document.getElementById("t").removeChild(d);  
    7. // <span>aaa</span>被去除  
    8. </script> 

    appendChild()方法：添加一个节点，如果文档树中已经存在该节点，则将它删除，然后在新位置插入。

    1. <body name="ddd"> 
    2. <div id = "t"><span>aaa</span><span>bbb</span><span>ccc</span></div> 
    3. </body> 
    4. <script> 
    5. var d = document.getElementById("t").firstChild;  
    6. document.getElementById("t").appendChild(d);  
    7. // <span>aaa</span>成了最后一个节点  
    8. </script> 

    replaceChild()方法：从文档树中删除（并返回）指定的子节点，用另一个节点来替换它。

    1. <body name="ddd"> 
    2. <div id = "t"><span>aaa</span><span>bbb</span><span>ccc</span></div> 
    3. </body> 
    4. <script> 
    5. var newd = document.createElement("span");  
    6. newd.innerHTML = "eee";  
    7. var oldd = document.getElementById("t").lastChild;  
    8. document.getElementById("t").replaceChild(newd,oldd);  
    9. // 最后一项成了 eee  
    10. </script> 

    insertBefore()方法：在指定节点的前面插入一个节点，如果已经存在，则删除原来的，然后在新位置插入。

    1. <body name="ddd"> 
    2. <div id = "t"><span>aaa</span><span>bbb</span><span>ccc</span></div> 
    3. </body> 
    4. <script> 
    5. var newd = document.createElement("span");  
    6. newd.innerHTML = "eee";  
    7. var where = document.getElementById("t").lastChild;  
    8. document.getElementById("t").insertBefore(newd,where);  
    9. // 在最后一项的前面多了一项 eee  
    10. </script> 

    cloneNode()方法：复制一个节点，该方法有一个参数，true表示同时复制所有的子节点，false表示近复制当前节点。

    1. <body name="ddd"> 
    2. <div id = "t"><span>aaa</span><span>bbb</span><span>ccc</span></div><div id = "m"></div> 
    3. </body> 
    4. <script> 
    5. var what = document.getElementById("t").cloneNode(false).innerHTML;  
    6. document.getElementById("m").innerHTML = what;  
    7. // 增加了一个aaabbbccc  
    8. </script>  
    9.  
    10. 1.Node往往被翻译为节点，在一个对象（可以简单的理解为是HTML页面中），一个属性name="aaa"可以是一个节点，一个< div id="aaa">……< /div>也可以是一个节点，在< body>……< /body>中的，也是一个大大的节点。下面是一些有关Node的属性和方法，并没有包含部分不兼容IE和FF内容的讲解。   
      2.  
      3.Node的属性介绍：   
      4.  
      5.nodeType：显示节点的类型   
      6.nodeName：显示节点的名称   
      7.nodeValue：显示节点的值   
      8.attributes：获取一个属性节点   
      9.firstChild：表示某一节点的第一个节点   
      10.lastChild：表示某一节点的最后一个子节点   
      11.childNodes：表示所在节点的所有子节点   
      12.parentNode：表示所在节点的父节点   
      13.nextSibling：紧挨着当前节点的下一个节点   
      14.previousSibling：紧挨着当前节点的上一个节点   
      15.ownerDocument：（不知）   
      16.  
      17.Node有各种各样的节点，我们先花一些时间认识他们，同时一并了解nodeType，nodeName和nodeValue属性：   
      18.名称：元素节点   
      19.nodeType：ELEMENT_NODE   
      20.nodeType值：1   
      21.nodeName：元素标记名   
      22.nodeValue：null  
      23.  
      24.<body>   
      25.<div id = "t" ><span></span></div>   
      26.</body>   
      27.<script>   
      28.var d = document.getElementById("t");   
      29.document.write(d.nodeType);   
      30.document.write(d.nodeName);   
      31.document.write(d.nodeValue);   
      32.//显示 1 DIV null   
      33.</script>   
      34.名称：属性节点   
      35.nodeType：ATTRIBUTE_NODE   
      36.nodeType值：2   
      37.nodeName：属性名   
      38.nodeValue：属性值   
      39.  
      40.<body>   
      41.<div id = "t" name="aaa"><span></span></div>   
      42.</body>   
      43.<script>   
      44.var d = document.getElementById("t").getAttributeNode("name");   
      45.document.write(d.nodeType);   
      46.document.write(d.nodeName);   
      47.document.write(d.nodeValue);   
      48.//显示 2 name aaa   
      49.</script>   
      50.名称：文本节点   
      51.nodeType：TEXT_NODE   
      52.nodeType值：3   
      53.nodeName：#text   
      54.nodeValue：文本内容   
      55.  
      56.<body>   
      57.<div id = "t">bbb</div>   
      58.</body>   
      59.<script>   
      60.var d = document.getElementById("t").firstChild;   
      61.document.write(d.nodeType);   
      62.document.write(d.nodeName);   
      63.document.write(d.nodeValue);   
      64.//显示 3 #text bbb    
      65.</script>   
      66.名称：CDATA文本节点（XML中传递文本的格式）   
      67.nodeType：CDATA_SECTION_NODE   
      68.nodeType值：4   
      69.nodeName：#cdata-section   
      70.nodeValue：CDATA文本内容   
      71.  
      72.（作者省略8个属性，需技术补充）   
      73.  
      74.attributes属性，直接获取一个属性节点，注意这里要使用[]，保持IE和FF的兼容性。   
      75.  
      76.<body name="ddd">   
      77.<div id = "t" name = "aaa"><span>aaa</span><span>bbb</span><span>ccc</span></div>   
      78.</body>   
      79.<script>   
      80.var d = document.getElementById("t").attributes["name"];   
      81.document.write(d.name);   
      82.document.write(d.value);   
      83.//显示 name aaa   
      84.</script>   
      85.firstChild和lastChild属性，表示某一节点的第一个和最后一个子节点：   
      86.  
      87.<body>   
      88.<div id = "t"><span>aaa</span><span>bbb</span><span>ccc</span></div>   
      89.</body>   
      90.<script>   
      91.var d = document.getElementById("t");   
      92.document.write(d.firstChild.innerHTML);   
      93.document.write(d.lastChild.innerHTML);   
      94.//显示 aaa ccc   
      95.</script>   
      96.childNodes和parentNode属性，表示所在节点的所有子节点和所在节点的父节点，这里的childNodes注意是一个数组：   
      97.  
      98.<body name="ddd">   
      99.<div id = "t"><span>aaa</span><span>bbb</span><span>ccc</span></div>   
      100.</body>   
      101.<script>   
      102.var d = document.getElementById("t");   
      103.document.write(d.childNodes[1].innerHTML);   
      104.document.write(d.parentNode.getAttribute("name"));   
      105.//显示 bbb ddd   
      106.</script>   
      107.nextSibling和previousSibling属性，分别表示在parentNode的childNodes[]数组中，紧挨着当前节点的上一个和下一个节点：   
      108.  
      109.<body name="ddd">   
      110.<div id = "t"><span>aaa</span><span>bbb</span><span>ccc</span></div>   
      111.</body>   
      112.<script>   
      113.var d = document.getElementById("t").childNodes[1];   
      114.document.write(d.nextSibling.innerHTML);   
      115.document.write(d.previousSibling.innerHTML);   
      116.//显示 ccc aaa   
      117.</script>   
      118.ownerDocument属性（不知如何使用）   
      119.  
      120.Node的方法介绍：   
      121.  
      122.hasChildNodes()：判定一个节点是否有子节点   
      123.removeChild()：去除一个节点   
      124.appendChild()：添加一个节点   
      125.replaceChild()：替换一个节点   
      126.insertBefore()：指定节点位置插入一个节点   
      127.cloneNode()：复制一个节点   
      128.normalize()：（不知）   
      129.  
      130.hasChildNodes()方法：判定一个节点是否有子节点，有返回true，没有返回false  
      131.  
      132.<body name="ddd">   
      133.<div id = "t"><span>aaa</span><span>bbb</span><span>ccc</span></div>   
      134.<div id = "m"></div>   
      135.</body>   
      136.<script>   
      137.alert(document.getElementById("t").hasChildNodes());   
      138.alert(document.getElementById("m").hasChildNodes());   
      139.// 第一个true，第二个false   
      140.</script>   
      141.removeChild()方法：去除一个节点   
      142.  
      143.<body name="ddd">   
      144.<div id = "t"><span>aaa</span><span>bbb</span><span>ccc</span></div>   
      145.</body>   
      146.<script>   
      147.var d = document.getElementById("t").firstChild;   
      148.document.getElementById("t").removeChild(d);   
      149.// <span>aaa</span>被去除   
      150.</script>   
      151.appendChild()方法：添加一个节点，如果文档树中已经存在该节点，则将它删除，然后在新位置插入。   
      152.  
      153.<body name="ddd">   
      154.<div id = "t"><span>aaa</span><span>bbb</span><span>ccc</span></div>   
      155.</body>   
      156.<script>   
      157.var d = document.getElementById("t").firstChild;   
      158.document.getElementById("t").appendChild(d);   
      159.// <span>aaa</span>成了最后一个节点   
      160.</script>   
      161.replaceChild()方法：从文档树中删除（并返回）指定的子节点，用另一个节点来替换它。   
      162.  
      163.<body name="ddd">   
      164.<div id = "t"><span>aaa</span><span>bbb</span><span>ccc</span></div>   
      165.</body>   
      166.<script>   
      167.var newd = document.createElement("span");   
      168.newd.innerHTML = "eee";   
      169.var oldd = document.getElementById("t").lastChild;   
      170.document.getElementById("t").replaceChild(newd,oldd);   
      171.// 最后一项成了 eee   
      172.</script>   
      173.insertBefore()方法：在指定节点的前面插入一个节点，如果已经存在，则删除原来的，然后在新位置插入   
      174.  
      175.<body name="ddd">   
      176.<div id = "t"><span>aaa</span><span>bbb</span><span>ccc</span></div>   
      177.</body>   
      178.<script>   
      179.var newd = document.createElement("span");   
      180.newd.innerHTML = "eee";   
      181.var where = document.getElementById("t").lastChild;   
      182.document.getElementById("t").insertBefore(newd,where);   
      183.// 在最后一项的前面多了一项 eee   
      184.</script>   
      185.cloneNode()方法：复制一个节点，该方法有一个参数，true表示同时复制所有的子节点，false表示近复制当前节点  
      186.  
      187.<body name="ddd">   
      188.<div id = "t"><span>aaa</span><span>bbb</span><span>ccc</span></div><div id = "m"></div>   
      189.</body>   
      190.<script>   
      191.var what = document.getElementById("t").cloneNode(false).innerHTML;   
      192.document.getElementById("m").innerHTML = what;   
      193.// 增加了一个aaabbbccc   
      194.</script>

      其它部分

      top：分割窗口最高层次的浏览器窗口。采用如下方式进行访问：top.frames['sub_frm'].*********

      parent：当前分割窗口的父窗口。采用如下方式访问：parent.document.*********

      opener：指用WINDOW.OPEN等方式创建的新窗口对应的原窗口。

      iframe: 在一个页面含有某个iframe，其id="iframeA" name="IframeA"，此时使用document.getElementById("IframeA")取到的是iframe标签对象，通过该对 象可以获取iframe的各个属性，例如src、frameborder、style等等，但是不能获取到iframe所包含的子页面的各个对象。如果使 用document.frames("IframeA")取到的是iframe组件对象，通过该对象可以获取到iframe所包含的页面的子页面的各个对 象，例如子页面的window对象，但是不能获得iframe标签得各个属性，例如上面说到的src等等。请参看如下类似代码：
      1.html
      <script>
      function check(){
          var obj1=document.getElementById("myframe");
          alert(obj1.src);
          //alert(obj1.window.document.myform.username.value);//Error
          var obj2=document.frames("myframe");
          alert(obj2.window.document.myform.username.value);
          //alert(obj2.src);//Error
      }
      </script>
      <body οnlοad="check()">
      <iframe id="myframe" name="myframe" src="http://dearhappyfish.blog.163.com/blog/2.html" frameborder="3" style="width:300;height:200;border-width:1;border-color:red;border-style:solid"></iframe>
      </body>
      2.html
      <body>
      <form name="myform">
          用户名：<input type="text" name="username" value="test" />
      </form>
      </body>

想旅游咯
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Js高程第十章DOM-Node类型
qq_24270109的博客
08-26 103
节点的childNodes属性 <div id='box'> <p>1-div</p> <div> <p>2-div</p> <h1>2-div</h1> </div> </div> <script> ...
dom里面的node节点属性
xiaozhuangyumaotao的博客
05-24 592
html文档载入后是document对象，html文档中的每个html标签对象我们都可以访问到，这些标签对象在js中都被称为节点(Node).节点通过nodeType属性区分为三类：元素节点(Element)，文本节点，属性节点。不论哪种节点都具有Node对象的属性 属性 属性描述 nodeName 节点名称 nodeType 节点类型 nodeValue ...
6.28 学习内容
thinkingw770s的博客
06-28 115
&lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;Title&lt;/title&gt; &lt;style type="text/css"&gt;
DOM——Node属性
W Y L
03-24 228
1、属性 1.1、Node.prototype.nodeType nodeType属性返回一个整数值，表示节点的类型。 document.nodeType // 9 //上面代码中，文档节点的类型值为9。 Node 对象定义了几个常量，对应这些类型值。 document.nodeType === Node.DOCUMENT_NODE // true //上面代码中，文档节点的nodeType属性...
JS之DOM操作--node简介、node属性、node方法
小白小白从不日别的博客
04-13 1038
主要介绍了js中node节点的常用属性和相关方法
JavaScript HTML DOM元素 节点操作汇总
10-16
本文将深入探讨DOM中的节点操作，包括添加、删除、替换和查找节点等基本操作。 首先，理解DOM的基本概念至关重要。DOM（Document Object Model）是一种标准，它将HTML或XML文档表示为一个树形结构，其中每个部分都...
JavaScript DOM节点操作方法总结
11-25
下面就分别从对元素节点的操作和对属性节点的操作来介绍。 元素节点 查 在对DOM进行增删改之前，首先要找到对应的元素。具体的查找方法如下： getElementByID() // 得到单个节点 getElementsByTagName() // 得到...
JavaScript DOM节点操作实例小结(新建,删除HTML元素)
10-20
总的来说，JavaScript DOM节点操作是Web开发中不可或缺的一部分，无论是新建元素来增加页面内容，还是删除元素来实现动态更新，都体现了JavaScript在网页动态化方面的强大能力。在实际项目中，开发者还需要注意性能...
JavaScript DOM节点添加示例
10-25
本节为大家介绍下JavaScript DOM节点添加，将node里面的str放到h1段落中使之成为h1的新段落
数据结构--知识点16--搜索算法(二叉树)
ANingL的博客
09-06 2939
文章目录一、树的概念1、特点2、树的术语3、树的种类4、树的存储与表示5、常见的树的应用场景二、二叉树1、概念2、性质 一、树的概念 树是一种抽象数据类型(ADT)或是视作这种抽象数据类型的数据结构 1、特点 每个节点有零个或多个子节点 没有父节点的节点称为根节点 每一个非根节点有且只有一个父节点 除了根节点外，每个子节点可以分为**多个不相交(因为都只有一个父节点)**的子树 2、树的术语 节点的度：一个节点含有的子树的个数称为该节点的度 树的度：一棵树中，最大的节点的度称为树的度 叶节点或终端节点
JS节点操作
Revin的博客
01-13 1811
节点概述 1.在JS中节点可分为父节点、子节点、兄弟节点。 又可分为元素节点、属性节点、文本节点 2.节点至少拥有三个基本属性，nodeType(节点类型）、nodeName(节点名称）、nodeValue(节点值） 元素节点的节点类型为1 （在对节点进行操作时，通常对元素节点进行操作） 属性节点的节点类型为2 文本节点的节点类型为3 节点操作 父节点操作 以往获取节点只能通过一次一次的输入，利用节点进行操作可以一步获取。获取方法为node.parentNode 具体例子如下 <body>
js操作dom节点
热门推荐
hujunsong的专栏
08-01 1万+
1.访问节点 document.getElementById(id); 返回对拥有指定id的第一个对象进行访问 document.getElementsByName(name); 返回带有指定名称的节点集合 注意:Elements document.getEl
DOM-节点（node)操作
最新发布
weixin_46341514的博客
08-13 202
node的动态创建，增加，删除，返回，复制，父子兄弟关系
js—DOM节点操作
otatoz
09-03 4783
一、定义 DOM ：文档对象模型 DMO是针对HTML文档的一个API（应用程序编程接口），DOM描绘了一个层次化的节点树，允许开发人员添加，删除，修改页面的某一部分。 节点分为几种不同的类型 ： Node类型 Document类型 Element类型 Text类型——文本类型 Comment类型 —— 注释类型 二、类型的具体说明 Node类型 属性：...
JavaScript HTML DOM节点类型之Node类型介绍
tasty
01-11 4065
JavaScript中所有HTML DOM节点类型都继承自Node类型，因此所有类型的节点都有一些相同的属性和方法。Node接口是DOM1级中定义的一个接口，在JavaScript中Node接口被实现为Node类型。 返回节点类型：nodeType返回节点名：nodeName返回或设置节点值：nodeValue节点间的关系节点操作 1. 返回节点类型nodeType no
心得1--js加强dom介绍与node使用
weixin_30782331的博客
11-07 42
1. DOM DOM= Document Object Model，文档对象模型，DOM可以以一种独立于平台和语言的方式访问和修改一个文档的内容和结构。换句话说，这是表示和处理一个HTML或XML文档的常用方法。有一点很重要，DOM的设计是以对象管理组织（OMG）的规约为基础的，因此可以用于任何编程语言. • D：文档 – html 文档 或 xml 文档 •...
js中的Node属性和方法
ruler1112的博客
07-18 2517
js中所有节点都实现了Node接口 1.node.nodeType: 这个方法能够获取节点类型常见的有下面几种: node.nodeType==1:元素节点,如body，ul... node.nodeType==2:属性节点,如name,type... node.nodeType==3:文本节点,就是一段文本(空格也算文本) node.nodeType==9:document类型,就是
Node节点操作案例（js）
weixin_53187940的博客
01-19 143
//对下面的表格进行增删改操作 Title 大清国皇帝 编号 姓名 图像 1 努尔哈赤
Javascript从零基础到精通——DOM
L3gacy
05-01 364
DOM（Document Object Model 文档对象模型） DOM定义了表示和修改文档所需的对象、行为和属性，以及这些对象之间的关系。 DOM操作 获取DOM节点 1、 document.getElementById(id名) 根据 id 属性获取对应的单个节点 2、getElementsByTagName(标签名) 根据标签名获取指定节点名字的数组, 得到的是一个集合, 数组对象...
js DOM学习笔记11
08-08
如果父节点没有子节点, 则firstChild和lastChild都为nullparentNode 父节点previousSibling 第一个节点的previ

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值