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 相关文章推荐
asp.net HttpHandler实现图片防盗链
Nov 09 Javascript
JavaScript面向对象之静态与非静态类
Feb 03 Javascript
JavaScript 更严格的相等 [译]
Sep 20 Javascript
如何阻止复制剪切和粘贴事件为了表单内容的安全
May 23 Javascript
jquery.ui.draggable中文文档(原文翻译)
Nov 15 Javascript
基于JQuery制作可编辑的表格特效
Dec 23 Javascript
js图片切换具体实现代码
Oct 13 Javascript
jquery日历插件e-calendar升级版
Nov 10 Javascript
详解jQuery中基本的动画方法
Dec 14 Javascript
vue2.0设置proxyTable使用axios进行跨域请求的方法
Oct 19 Javascript
JS实现的冒泡排序,快速排序,插入排序算法示例
Mar 02 Javascript
VUE页面中通过双击实现复制表格中内容的示例代码
Jun 11 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伪造referer的方法 利用referer防止图片盗链
2014/01/20 PHP
php安全配置记录和常见错误梳理(总结)
2017/03/28 PHP
PHP中的浅复制与深复制的实例详解
2017/10/26 PHP
Laravel框架生命周期与原理分析
2018/06/12 PHP
Jquery Autocomplete 结合asp.net使用要点
2010/10/29 Javascript
利用JS自动打开页面上链接的实现代码
2011/09/25 Javascript
JavaScript 上万关键字瞬间匹配实现代码
2013/07/07 Javascript
jQuery学习笔记之jQuery动画效果
2013/09/09 Javascript
jquery禁止回车触发表单提交
2014/12/12 Javascript
AngularJS表单编辑提交功能实例
2015/02/13 Javascript
js+css实现文字散开重组动画特效代码分享
2015/08/21 Javascript
jQuery链式操作实例分析
2015/11/16 Javascript
JavaScript获取各大浏览器信息图示
2015/11/20 Javascript
js实现异步循环实现代码
2016/02/16 Javascript
jQuery简单实现仿京东分类导航层效果
2016/06/07 Javascript
vue升级之路之vue-router的使用教程
2018/08/14 Javascript
webpack HappyPack实战详解
2019/10/08 Javascript
Node.js中出现未捕获异常的处理方法
2020/06/29 Javascript
[06:25]第二届DOTA2亚洲邀请赛主赛事第二天比赛集锦.mp4
2017/04/03 DOTA
python 切片和range()用法说明
2013/03/24 Python
Python-OpenCV基本操作方法详解
2018/04/02 Python
使用python执行shell脚本 并动态传参 及subprocess的使用详解
2020/03/06 Python
CSS3 分类菜单效果
2019/05/27 HTML / CSS
Currentbody法国:健康与美容高科技产品
2020/08/16 全球购物
解释一下Windows的消息机制
2014/01/30 面试题
为什么要使用servlet
2016/01/17 面试题
会计自我鉴定
2013/11/02 职场文书
2014年教师培训的自我评价
2014/01/03 职场文书
幼儿园教育教学反思
2014/01/31 职场文书
《难忘的泼水节》教学反思
2014/02/27 职场文书
青年教师个人总结
2015/02/11 职场文书
地球一小时活动总结
2015/02/27 职场文书
公司员工宿舍管理制度
2015/08/03 职场文书
python函数的两种嵌套方法使用
2022/04/02 Python
MySQL控制流函数(-if ,elseif,else,case...when)
2022/07/07 MySQL
详解apache编译安装httpd-2.4.54及三种风格的init程序特点和区别
2022/07/15 Servers