javascript替换已有元素replaceChild()使用介绍


Posted in Javascript onApril 03, 2014

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); //1 
var lastChild = oDiv.lastElementChild ? oDiv.lastElementChild : oDiv.lastChild; 
oSpan = document.createElement("span"); 
oSpan.innerHTML = "5"; 
returnNode = oDiv.replaceChild(oSpan, lastChild); //替换最后一个,返回被替换掉的元素 
alert(returnNode.innerHTML);//3

<div id="guoDiv"> 
<span>1</span> 
<span>2</span> 
<span>3</span> 
</div>
Javascript 相关文章推荐
javascript获取URL参数与参数值的示例代码
Dec 20 Javascript
js设置function参数默认值(适合没有传参情况)
Feb 24 Javascript
教你用AngularJS框架一行JS代码实现控件验证效果
Jun 23 Javascript
jQuery中scrollLeft()方法用法实例
Jan 16 Javascript
js实现3D图片逐张轮播幻灯片特效代码分享
Sep 09 Javascript
给angular加上动画效遇到的问题总结
Feb 17 Javascript
详解jQuery的Cookie插件
Nov 23 Javascript
Vue.js实现双向数据绑定方法(表单自动赋值、表单自动取值)
Aug 27 Javascript
React项目动态设置title标题的方法示例
Sep 26 Javascript
jQuery 判断元素是否存在然后按需加载内容的实现代码
Jan 16 jQuery
Vue实现点击箭头上下移动效果
Jun 11 Javascript
vue 使用微信jssdk,调用微信相册上传图片功能
Nov 13 Javascript
Extjs grid添加一个图片状态或者按钮的方法
Apr 03 #Javascript
ExtJS 刷新后如何默认选中刷新前最后一次选中的节点
Apr 03 #Javascript
单击和双击事件的冲突处理示例代码
Apr 03 #Javascript
在jquery boxy中添加百度地图坐标拾取注意流程
Apr 03 #Javascript
邮箱下拉自动填充选择示例代码附图
Apr 03 #Javascript
JS获取网页属性包括宽、高等等
Apr 03 #Javascript
jQuery的$.proxy()应用示例介绍
Apr 03 #Javascript
You might like
php smarty模板引擎的6个小技巧
2014/04/24 PHP
PHP中常见的缓存技术实例分析
2015/09/23 PHP
详细解读php的命名空间(二)
2018/02/21 PHP
PHP创建对象的六种方式实例总结
2019/06/27 PHP
laravel实现图片上传预览,及编辑时可更换图片,并实时变化的例子
2019/11/14 PHP
jQuery插件实现大图全屏图片相册
2015/03/14 Javascript
纯JS实现本地图片预览的方法
2015/07/31 Javascript
Node.js重新刷新session过期时间的方法
2016/02/04 Javascript
Bootstrap入门书籍之(零)Bootstrap简介
2016/02/17 Javascript
JS实现一次性弹窗的方法【刷新后不弹出】
2016/12/26 Javascript
详解Vue使用 vue-cli 搭建项目
2017/04/20 Javascript
Nuxt的动态路由和参数校验操作
2020/11/09 Javascript
[35:44]2014 DOTA2华西杯精英邀请赛 5 24 iG VS VG
2014/05/26 DOTA
Python中设置变量访问权限的方法
2015/04/27 Python
python excel使用xlutils类库实现追加写功能的方法
2018/05/02 Python
基于python3 pyQt5 QtDesignner实现窗口化猜数字游戏功能
2019/07/15 Python
python使用paramiko模块通过ssh2协议对交换机进行配置的方法
2019/07/25 Python
django框架面向对象ORM模型继承用法实例分析
2019/07/29 Python
pycharm 安装JPype的教程
2019/08/08 Python
Python关于__name__属性的含义和作用详解
2020/02/19 Python
Python print不能立即打印的解决方式
2020/02/19 Python
Django Channel实时推送与聊天的示例代码
2020/04/30 Python
基于Tensorflow的MNIST手写数字识别分类
2020/06/17 Python
CSS3 实现footer 固定在底部(无论页面多高始终在底部)
2019/10/15 HTML / CSS
HTML 5 input placeholder 属性如何完美兼任ie
2014/05/12 HTML / CSS
法国女性内衣购物网站:Glamuse
2019/05/13 全球购物
软件测试题目
2013/02/27 面试题
授权委托书怎么写
2014/04/03 职场文书
解除合同协议书
2014/04/17 职场文书
村长反四风问题个人对照检查材料
2014/09/21 职场文书
军人离婚协议书样本
2014/10/21 职场文书
2014年体育教师工作总结
2014/12/03 职场文书
创业计划书之便利店
2019/09/05 职场文书
PHP控制循环操作的时间
2021/04/01 PHP
mysql 获取时间方式
2022/03/20 MySQL
xhunter1.sys可以删除嘛? win11提示xhunter1.sys驱动不兼容解决办法
2022/09/23 数码科技