javascript节点操作replaceChild()
replaceChild(a,b)是用来替换文档中的已有元素的
参数a:要插入的节点,
参数b:要替换的节点
var oDiv = document.getElementById("guoDiv");
var oSpan = document.createElement("span");
oSpan.innerHTML = "4";
var firsChild = oDiv.firstElementChild ? oDiv.firstElementChild : oDiv.firstChild
var returnNode = oDiv.replaceChild(oSpan, firsChild); //替换第一个元素,返回被替换掉的元素
alert(returnNode.innerHTML); //
var lastChild = oDiv.lastElementChild ? oDiv.lastElementChild : oDiv.lastChild;
oSpan = document.createElement("span");
oSpan.innerHTML = "5";
returnNode = oDiv.replaceChild(oSpan, lastChild); //替换最后一个,返回被替换掉的元素
alert(returnNode.innerHTML);//
<div id="guoDiv">
<span>1</span>
<span>2</span>
<span>3</span>
</div>
javascript节点操作replaceChild()的更多相关文章
- JavaScript 节点操作Dom属性和方法(转)
JavaScript 节点操作Dom属性和方法 一些常用的dom属性和方法,列出来作为手册用. 属性: 1.Attributes 存储节点的属性列表(只读) 2.childNodes 存储 ...
- 【转】JavaScript 节点操作 以及DOMDocument属性和方法
最近发现DOMDocument对象很重要,还有XMLHTTP也很重要 注意大小写一定不能弄错. 属性: 1Attributes 存储节点的属性列表(只读) 2childNodes 存储节点的子节点列表 ...
- JavaScript -- 节点操作, 事件触发, 表单伸缩
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- javascript 节点操作拷贝节点cloneNode()
cloneNode(a)方法接受一个布尔值参数,表示是否深拷贝 true:表示执行深拷贝,复制本节点以及整个子节点树. false:浅拷贝.只复制节点本身. 复制后返回的节点副本属于文档所有,但是并没 ...
- javascript节点操作appendChild()
cloneNode(a)方法接受一个布尔值参数,表示是否深拷贝 true:表示执行深拷贝,复制本节点以及整个子节点树. false:浅拷贝.只复制节点本身. 复制后返回的节点副本属于文档所有,但是并没 ...
- javascript节点操作移出节点removeChild()
removeChild(a)是用来删除文档中的已有元素 参数a:要移出的节点 <div id="guoDiv"> <span>1</span> ...
- javascript节点操作insertBefor()
如果想要把节点放在某个特定的位置,而不是放在末尾,就可以使用insertBefore(a,b) 参数a:要插入的节点 参数b:作为参照的节点. var oDiv = document.getEleme ...
- JS节点操作(JS原生+JQuery)
JavaScript与JQuery节点操作 节点关系与类型 任何HTML元素,都有nodeType属性.值有1~12,常用的有: 1.元素节点 2.文本节点 8.注释节点 9.document节点 ...
- javaScript之节点操作
javaScript程序员避免不了要操作页面中的DOM,除了经常使用的: appendChild()向childNodes列表的末尾添加一个节点. insertBefore(),接受两个参数,要插入的 ...
随机推荐
- Linux运维常用150个命令
Linux运维常用150个命令 转载自:www.cnblogs.com/bananaaa/p/7774467.html 命令 功能说明 线上查询及帮助命令(2个) man 查看命令帮助,命令的词典,更 ...
- STM32 LSM6DSL 陀螺仪数据采集
/************************************************************************************ * STM32 LSM6DS ...
- Samsung_tiny4412(驱动笔记07)----spinlock,semaphore,atomic,mutex,completion,interrupt
/*********************************************************************************** * * spinlock,se ...
- dice 概率论 概率DP
题目链接: http://acm.hdu.edu.cn/contests/contest_showproblem.php?pid=1010&cid=459 找出公式,公式有实际意义,某种情形当 ...
- Cassandra 数据库, python cqlsh命令
★ cql操作数据库(cqlsh.bat: python cqlsh命令操作<优缺点:https://blog.csdn.net/vbirdbest/article/details/77662 ...
- js操作链接url
使用js对当前的URL进行操作,可以使用内置对象window.location: window.location有以下属性: window.location.href:取得当前地址栏中的完整URL,可 ...
- oracle 拆分字符串并转换为表
使用函数的方式 1. 创建的函数以及类型如下: CREATE OR REPLACE TYPE str_split IS TABLE OF VARCHAR2 (4000);CREATE OR REPLA ...
- ThinkPHP 一直坚挺着
ThinkPHP 一直坚挺着 从最初的 0.6 到现在的 5.2 ThinkPHP 走过了 12 年. 从 PHP 4 迭代到 PHP 7.3,每一次更新都给开源社区注入了活力. 这次国内开源软件的投 ...
- java 中一些需要注意的知识点
java数组的length属性是容量,而不是数组真实元素的个数: 多线程中的interrupt()方法并不会终止处于"运行状态"的线程,它只是将线程的中断标记设为true. juc ...
- WPF ListView 简单的拖拽实现(转)
首先设置ListView的AllowDrop=True:SelectionMode=Extended;并且ListView视图为GridVIew. private void listView1_Mou ...