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继承机制的设计思想分享
Aug 28 Javascript
使用jQuery实现的掷色子游戏动画效果
Mar 14 Javascript
jQuery实现点击图片翻页展示效果的方法
Feb 16 Javascript
js正则表达式匹配数字字母下划线等
Apr 14 Javascript
使用js复制链接中的部分文字的方法
Jul 30 Javascript
使用Function.apply()的参数数组化来提高 JavaScript程序性能的技巧
Dec 23 Javascript
Node.js中防止错误导致的进程阻塞的方法
Aug 11 Javascript
浅述节点的创建及常见功能的实现
Dec 15 Javascript
JavaScript 上传文件(psd,压缩包等),图片,视频的实现方法
Jun 19 Javascript
详解vue项目的构建,打包,发布全过程
Nov 23 Javascript
详解如何构建一个Angular6的第三方npm包
Sep 07 Javascript
vue进入页面时不在顶部,检测滚动返回顶部按钮问题及解决方法
Oct 30 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面向对象
2012/02/22 PHP
php中jQuery插件autocomplate的简单使用笔记
2012/06/14 PHP
php获取域名的google收录示例
2014/03/24 PHP
PHP实现支持CURL字符串证书传输的方法
2019/03/23 PHP
yii2.0框架实现上传excel文件后导入到数据库的方法示例
2020/04/13 PHP
jquery.alert 弹出式复选框实现代码
2009/06/15 Javascript
JavaScript异步调用定时方法并停止该方法实现代码
2012/03/16 Javascript
你必须知道的Javascript知识点之&quot;深入理解作用域链&quot;的介绍
2013/04/23 Javascript
js确认删除对话框效果的示例代码
2014/02/20 Javascript
JS获取单击按钮单元格所在行的信息
2014/06/17 Javascript
Jquery焦点图实例代码
2014/11/25 Javascript
javascript实现window.print()去除页眉页脚
2014/12/30 Javascript
跟我学习javascript的undefined与null
2015/11/17 Javascript
jquery ajax分页插件的简单实现
2016/01/27 Javascript
JS插件plupload.js实现多图上传并显示进度条
2016/11/29 Javascript
Vue Element使用icon图标教程详解(第三方)
2018/02/07 Javascript
vue cli升级webapck4总结
2018/04/04 Javascript
vue-cli扩展多模块打包的示例代码
2018/04/09 Javascript
解决layui表格的表头不滚动的问题
2019/09/04 Javascript
如何基于JavaScript判断图片是否加载完成
2019/12/28 Javascript
Angular+Ionic使用queryParams实现跳转页传值的方法
2020/09/05 Javascript
[02:40]DOTA2殁境神蚀者 英雄基础教程
2013/11/26 DOTA
使用70行Python代码实现一个递归下降解析器的教程
2015/04/17 Python
Python中的choice()方法使用详解
2015/05/15 Python
python实现控制COM口的示例
2019/07/03 Python
Django实现auth模块下的登录注册与注销功能
2019/10/10 Python
HTML5中的Web Notification桌面通知功能的实现方法
2019/07/29 HTML / CSS
很酷的小工具和电子产品商城:GearBest
2016/11/19 全球购物
简约控的天堂:The Undone
2016/12/21 全球购物
Footshop罗马尼亚:最好的运动鞋选择
2019/09/10 全球购物
乔迁宴答谢词
2014/01/21 职场文书
医德考评自我评价
2014/09/14 职场文书
通知函的格式
2015/04/27 职场文书
怒海潜将观后感
2015/06/11 职场文书
2016年教师党员承诺书范文
2016/03/24 职场文书
Python编程编写完善的命令行工具
2021/09/15 Python