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引起的内存泄漏问题
Oct 08 Javascript
js的参数有长度限制吗?发现不能超过2083个字符
Apr 20 Javascript
一个实用的图片切换支持点击切换和自动轮播
Sep 09 Javascript
详细分析使用AngularJS编程中提交表单的方式
Jun 19 Javascript
基于PHP和Mysql相结合使用jqGrid读取数据并显示
Dec 02 Javascript
使用Ajax与服务器(JSON)通信实例
Nov 04 Javascript
利用JS实现页面删除并重新排序功能
Dec 09 Javascript
jQuery操作之效果详解
May 19 jQuery
深入理解React中何时使用箭头函数
Aug 23 Javascript
Vue项目中如何引入icon图标
Mar 28 Javascript
Vuejs中的watch实例详解(监听者)
Jan 05 Javascript
vue 输入电话号码自动按3-4-4分割功能的实现代码
Apr 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
图解上海144收音机
2021/03/02 无线电
php+ajax实现文章自动保存的方法
2014/12/30 PHP
如何用PHP做到页面注册审核
2017/03/02 PHP
JQuery 构建客户/服务分离的链接模型中Table分页代码效率初探
2010/01/22 Javascript
json格式的时间显示为正常年月日的方法
2013/09/08 Javascript
JQuery 实现在同一页面锚点链接之间的平滑滚动
2014/10/29 Javascript
JS实现自动定时切换的简洁网页选项卡效果
2015/10/13 Javascript
JavaScript正则表达式匹配 div  style标签
2016/03/15 Javascript
简单的分页代码js实现
2016/05/17 Javascript
微信小程序访问node.js接口服务器搭建教程
2017/04/25 Javascript
nodejs socket实现的服务端和客户端功能示例
2017/06/02 NodeJs
基于Vue 服务端Cookies删除的问题
2018/09/21 Javascript
JavaScript如何判断对象有某属性
2020/07/03 Javascript
Element Tooltip 文字提示的使用示例
2020/07/26 Javascript
解决vue-photo-preview 异步图片放大失效的问题
2020/07/29 Javascript
python将图片文件转换成base64编码的方法
2015/03/14 Python
Python判断Abundant Number的方法
2015/06/15 Python
vue.js实现输入框输入值内容实时响应变化示例
2018/07/07 Python
Django框架模板注入操作示例【变量传递到模板】
2018/12/19 Python
Python初学者常见错误详解
2019/07/02 Python
libreoffice python 操作word及excel文档的方法
2019/07/04 Python
Python3 shelve对象持久存储原理详解
2020/03/23 Python
浅谈django 模型类使用save()方法的好处与注意事项
2020/03/28 Python
Python爬虫之App爬虫视频下载的实现
2020/12/08 Python
全球知名巧克力品牌:Godiva
2016/07/22 全球购物
澳大利亚手表品牌:Time IV Change
2018/10/06 全球购物
武汉瑞得软件笔试题
2015/10/27 面试题
英语专业大学生求职简历的自我评价
2013/10/18 职场文书
安全技术说明书
2014/05/09 职场文书
启动仪式策划方案
2014/06/14 职场文书
委托证明书
2014/09/17 职场文书
2015年家长学校工作总结
2015/04/22 职场文书
撤诉状格式范本
2015/05/19 职场文书
运动会广播稿200字
2015/08/19 职场文书
公文写作:新员工转正申请书范本3篇!
2019/08/07 职场文书
Java使用HttpClient实现文件下载
2022/08/14 Java/Android