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 和 CSS 实现脚注(Footnote)效果
Sep 09 Javascript
javascript下4个跨浏览器必备的函数
Mar 07 Javascript
浅谈JavaScript编程语言的编码规范
Oct 21 Javascript
使用Java实现简单的server/client回显功能的方法介绍
May 03 Javascript
JS检测图片大小的实例
Aug 21 Javascript
js的匿名函数使用介绍
Dec 11 Javascript
再JavaScript的jQuery库中编写动画效果的指南
Aug 13 Javascript
js利用appendChild对标签进行排序的实现方法
Oct 16 Javascript
VUE axios上传图片到七牛的实例代码
Jul 28 Javascript
详解使用vue-cli脚手架初始化Vue项目下的项目结构
Mar 08 Javascript
vue.js删除列表中的一行
Jun 30 Javascript
Vue页面渲染中key的应用实例教程
Jan 12 Vue.js
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
解决CodeIgniter伪静态失效
2014/06/09 PHP
PHP查找数值数组中不重复最大和最小的10个数的方法
2015/04/20 PHP
使用ltrace工具跟踪PHP库函数调用的方法
2016/04/25 PHP
将HTML自动转为JS代码
2006/06/26 Javascript
event.keyCode键码值表 附只能输入特定的字符串代码
2009/05/15 Javascript
基于JavaScript实现鼠标悬浮弹出跟随鼠标移动的带箭头的信息层
2016/01/18 Javascript
jQuery使用ajax跨域获取数据的简单实例
2016/05/18 Javascript
javascript基本语法
2016/05/31 Javascript
js 获取经纬度的实现方法
2016/06/20 Javascript
JavaScript String(字符串)对象的简单实例(推荐)
2016/08/31 Javascript
ReactNative-JS 调用原生方法实例代码
2016/10/08 Javascript
jQuery使用DataTable实现删除数据后重新加载功能
2017/02/27 Javascript
vue.js开发环境搭建教程
2017/05/04 Javascript
Javascript(es2016) import和require用法和区别详解
2017/08/11 Javascript
Vue.js单向绑定和双向绑定实例分析
2018/08/14 Javascript
vue路由跳转传参数的方法
2019/05/06 Javascript
js实现图片推拉门效果代码实例
2019/05/18 Javascript
使用Vue.observable()进行状态管理的实例代码详解
2019/05/26 Javascript
vue服务端渲染操作简单入门实例分析
2019/08/28 Javascript
打开电脑上的QQ的python代码
2013/02/10 Python
Python删除windows垃圾文件的方法
2015/07/14 Python
Python实现的破解字符串找茬游戏算法示例
2017/09/25 Python
Python tkinter事件高级用法实例
2018/01/31 Python
使用apidoc管理RESTful风格Flask项目接口文档方法
2018/02/07 Python
python如何实现从视频中提取每秒图片
2020/10/22 Python
Python爬虫图片懒加载技术 selenium和PhantomJS解析
2019/09/18 Python
Python上下文管理器全实例详解
2019/11/12 Python
菲律宾最大的网上花店和礼品店:PhilFlower.com
2018/02/09 全球购物
世界上最值得信赖的多日游在线市场:TourRadar
2018/07/20 全球购物
小学生综合素质评语
2014/04/23 职场文书
村居抓节水倡议书
2014/05/19 职场文书
报表员工作失误检讨书范文
2014/09/19 职场文书
写给医院的感谢信
2015/01/22 职场文书
歌舞青春观后感
2015/06/10 职场文书
《莫泊桑拜师》教学反思
2016/02/22 职场文书
java实现自定义时钟并实现走时功能
2022/06/21 Java/Android