创建、插入、删除、查询、替换dom节点的方法（JS实现）

1、创建元素节点：createElement

用法：document.createElement("p");//创建p标签；

创建文本节点：createTextNode;

用法：document.createTextNode("txt");//创建文本标签；

2、插入节点：appendchild:在要插入的元素节点上调用，他插入指定的节点使其成为那个节点的最后一个子节点。

insertBefore:在已有的元素前插入一个新元素；

insertAfter:在现有的元素后面插入一个新元素；

3、删除节点：removeChild;从文档树中删除一个节点（先找到要删除节点的父节点，用父节点删除）；

用法：var para1=document.getElementById("p1");

para1.parentNode.removeChild(para1);

4、替换节点：replaceChild;将一个节点替换为另一个节点（先找到要替换的节点的父节点，用父节点替换）；

时间： 2024-10-10 21:36:19

创建、插入、删除、查询、替换dom节点的方法（JS实现）的相关文章

JavaScript之jQuery-3 jQuery操作DOM(查询、样式操作、遍历节点、创建插入删除、替换、复制)

一.jQuery操作DOM - 查询 html操作 - html(): 读取或修改节点的HTML内容,类似于JavaScript中的innerHTML属性 文本操作 - text(): 读取或修改节点的文本内容,类似于JavaScript中的textContent属性 值操作 - val(): 读取或修改节点的value属性值,类似于 JavaScript 中的value值 属性操作 - attr(): 读取或者修改节点的属性 - removeAttr(): 删除节点的属性 二.jQuery操作

HDU 5349 动态插入删除查询数据-multiset

题意:动态的插入删除查询数据,允许数据重复 分析:一看就是个multiset,直接做.STL大法好. 代码: #include<iostream> #include<cstring> #include<cstdio> #include<algorithm> #include<vector> #include<set> using namespace std; int n; int a; multiset<int> s; i

不常用的寻找dom节点的方法

有关表格的两个对象获取方式 var tab = document.getElementById(“tab1”)          ;        //假设tab1是一个table的id,则: var allRow = tab.rows;    //代表tab的所有行, 也是一个集合,也可以使用tab.getElementsByTagName("tr") var oneRow = allRow[0]; //表示tab中的第一行(第一个tr) var allTd = oneRow.cel

HTML DOM的创建，删除及替换

创建HTML元素 document.appendChild() 将新元素作为父元素的最后一个子元素进行添加 如需向HTML DOM添加新元素,首先必须创建该元素,然后把它追加到已有的元素上 var newElement = document.createElement("p") //创建新元素p var newTextNode = document.createTextNode("文本节点") //创建新文本节点 newElement.appendChild(new

链表 创建 插入 删除 查找 合并

最近学习了一下单链表的操作,将代码保存如下,供以后查看. 链表创建: 1.先建立一个不含数据的头指针*head,头指针的链接域为NULL. 2.声明一个用于暂存新申请空间的指针*pc,一个用于保存创建的链表的指针*r,令*r指向*head. 3.在循环中,为指针*pc申请空间,并给数据域赋值,head->next = pc, pc->next = NULL, head = pc. #define _CRT_SECURE_NO_DEPRECATE /*取消scanf,printf不安全之类的错误

[PHP] 数据结构-链表创建-插入-删除-查找的PHP实现

链表获取元素1.声明结点p指向链表第一个结点,j初始化1开始2.j<i,p指向下一结点,因为此时p是指向的p的next,因此不需要等于3.如果到末尾了,p还为null,就是没有查找到 插入元素1.插入元素和查找类似,找到位置后2.生成新的结点s, s->next=p->next p->next=s; 删除元素1.删除元素,找到位置后2.绕过一下,q=p->next p->next=q->next; <?php class Node{ public $data

js获取HTML DOM节点元素方法总结

1. 通过顶层document节点获取:    (1)document.getElementById(elementId) :通过ID获得节点,如果页面上含有多个相同id的节点,那么只返回第一个节点.   (2)document.getElementsByName(elementName) :通过name获取节点,从名字可以看出,这个方法返回的不是一个节点元素,而是具有同样名称的节点数组.然后,我们可以通过要获取节点的某个属性来循环判断是否为需要的节点.            例如:在HTML中

DOM节点的删除（jQuery）

1DOM节点删除之empty()的基本用法 要移除页面上节点是开发者常见的操作,jQuery提供了几种不同的方法用来处理这个问题,这里我们开仔细了解下empty方法 empty 顾名思义,清空方法,但是与删除又有点不一样,因为它只移除了 指定元素中的所有子节点. 这个方法不仅移除子元素(和其他后代元素),同样移除元素里的文本.因为,根据说明,元素里任何文本字符串都被看做是该元素的子节点.请看下面的HTML: <div class="hello"><p>慕课网&l

jQuery修炼心得-DOM节点的删除

要移除页面上节点是开发者常见的操作,jQuery提供了几种不同的方法用来处理这个问题. 1.empty empty 顾名思义,清空方法,但是与删除又有点不一样,因为它只移除了 指定元素中的所有子节点. 这个方法不仅移除子元素(和其他后代元素),同样移除元素里的文本.因为,根据说明,元素里任何文本字符串都被看做是该元素的子节点.如果我们通过empty方法移除里面div的所有元素,它只是清空内部的html代码,但是标记仍然留在DOM中,通过empty移除了当前div元素下的所有p元素 但是本身id=