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来定义类的规范小结
Nov 19 Javascript
基于jQuery实现的Ajax 验证用户名是否存在的实现代码
Apr 06 Javascript
分享XmlHttpRequest调用Webservice的一点心得
Jul 20 Javascript
Jquery 模板数据绑定插件的使用方法详解
Jul 08 Javascript
jQuery实现炫酷的鼠标轨迹特效
Feb 01 Javascript
JS实现的简洁纵向滑动菜单(滑动门)效果
Oct 19 Javascript
JS+CSS实现的竖向简洁折叠菜单效果代码
Oct 22 Javascript
JavaScript中的return布尔值的用法和原理解析
Aug 14 Javascript
vue组件实现文字居中对齐的方法
Aug 23 Javascript
微信小程序tabBar 返回tabBar不刷新页面
Jul 25 Javascript
vue实现登录、注册、退出、跳转等功能
Dec 23 Vue.js
TypeScript实用技巧 Nominal Typing名义类型详解
Sep 23 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 file_put_contents()功能函数(集成了fopen、fwrite、fclose)
2011/05/24 PHP
windows下zendframework项目环境搭建(通过命令行配置)
2012/12/06 PHP
如何在smarty中增加类似foreach的功能自动加载数据
2013/06/26 PHP
JS中剪贴板兼容性、判断复制成功或失败
2021/03/09 Javascript
jQuery在vs2008及js文件中的无智能提示的解决方法
2010/12/30 Javascript
Javascript base64编码实现代码
2011/12/02 Javascript
jQuery在IE下使用未闭合的xml代码创建元素时的Bug介绍
2012/01/10 Javascript
简单实例处理url特殊符号&amp;处理(2种方法)
2013/04/02 Javascript
Json和Jsonp理论实例代码详解
2013/11/15 Javascript
jquery取子节点及当前节点属性值的方法
2014/09/09 Javascript
jQuery+PHP实现动态数字展示特效
2015/03/14 Javascript
jQuery Validate表单验证入门学习
2015/12/18 Javascript
JS原型、原型链深入理解
2016/02/27 Javascript
JavaScript编写点击查看大图的页面半透明遮罩层效果实例
2016/05/09 Javascript
Vue.js组件tree实现省市多级联动
2016/12/02 Javascript
详解jQuery lazyload 懒加载
2016/12/19 Javascript
浅谈js算法和流程控制
2016/12/29 Javascript
vue移动UI框架滑动加载数据的方法
2018/03/12 Javascript
Vue自定义全局Toast和Loading的实例详解
2019/04/18 Javascript
详解三种方式在React中解决绑定this的作用域问题并传参
2020/08/18 Javascript
js实现石头剪刀布游戏
2020/10/11 Javascript
vue绑定class的三种方法
2020/12/24 Vue.js
python调用shell的方法
2013/11/20 Python
Python实现多线程下载文件的代码实例
2014/06/01 Python
解析Python中while true的使用
2015/10/13 Python
tensorflow tf.train.batch之数据批量读取方式
2020/01/20 Python
Python3操作MongoDB增册改查等方法详解
2020/02/10 Python
python 负数取模运算实例
2020/06/03 Python
python3排序的实例方法
2020/10/20 Python
实列教程 一款基于jquery和css3的响应式二级导航菜单
2014/11/13 HTML / CSS
html5指南-7.geolocation结合google maps开发一个小的应用
2013/01/07 HTML / CSS
以下的初始化有什么区别
2013/12/16 面试题
如何判断计算机可能已经中马
2013/03/22 面试题
浪漫婚礼主持词
2014/03/14 职场文书
物理教育专业求职信
2014/06/25 职场文书
2019年特色火锅店的创业计划书模板
2019/08/28 职场文书