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(),接受两个参数,要插入的 ...
随机推荐
- FMX StringGrid向上滑动自动加载记录(二)
写完FMX StringGrid向上滑动自动加载记录(一)自己也觉得不理想,实现的别扭与复杂,现在找到更好的实现方法,原来,StringGrid从基类TCustomPresentedScrollBox ...
- tp5中捕获异常的配置
首选在配置文件中加入配置如下 // 异常处理handle类 留空使用 \think\exception\Handle 'exception_handle' => '\\app\ ...
- vs2010将写好的软件打包安装包经验
(1) 用VS2010打开已经编写好准备做安装包的软件程序,右击解决方案,添加新建项目. (2) 在“新建项目”对话框中,选择“其他项目类型”,再选择“安装和部署”,然后在模板中选择“安装项目” (3 ...
- Redis学习第五课:Redis Set类型及操作
Set是集合,它是string类型的无序集合.set是通过hash table实现的,添加.删除和查找的复杂度都是O(1). 对集合我们可以取并集.交集.差集.通过这些操作我们可以实现SNS中的好友推 ...
- Intellij导入插件工程,不能运行(需要EditConfiguration)
https://blog.csdn.net/wjskeepmaking/article/details/78815896 可以作为参考 这里要说的一点是,如果项目被识别为plugin,那么就应该在项目 ...
- 人脸对齐matlab实现-FaceAlignment 3000fps
前言 最近研读了孙剑团队的Face Alignment at 3000fps via Regressing Local Binary Features这篇paper,基于matlab进行实现. 实现原 ...
- for-auto使用
前言 c++11新增了一个工具,让编译器能够根据初始值的类型推断变量的类型: c++11还新增了一种循环,基于范围的for循环,可以对数组或者容器类的每一个元素执行相同的操作:同时,可以使用& ...
- 将整个文件夹推上github
/*游戏或者运动才能让我短暂的忘记心痛,现如今感觉学习比游戏和运动还重要——曾少锋*/ 首先你要有一个本地仓库和一个远程仓库(github中的仓库).git文件夹下面不能含有 git文件夹,如果有的话 ...
- [UE4]虚幻4的智能指针
虚幻自己实现了一套智能指针系统,为了跨平台. 指针: 占用8个字节,4个字节的Object指针,4字节的引用计数控制器的指针, 引用计数控制器需要12字节, 一个C++的Object指针4字节,一个共 ...
- 浏览器中的data类型的Url格式,data:image/png,data:image/jpeg!(源自:http://blog.csdn.net/roadmore/article/details/38498719)
所谓"data"类型的Url格式,是在RFC2397中 提出的,目的对于一些“小”的数据,可以在网页中直接嵌入,而不是从外部文件载入.例如对于img这个Tag,哪怕这个图片非常非常 ...