javaScript(JS)替换节点实现思路介绍


Posted in Javascript onApril 17, 2013
<title></title> 
<script type="text/javascript"> 
function createNode() { 
var pNode = document.createElement('p'); 
var tNode = document.createTextNode('烟花三月下杨州'); 
pNode.appendChild(tNode); 
document.body.appendChild(pNode); 
} 
function r() { 
var pNode = document.createElement('p'); 
var tNode = document.createTextNode('故人西辞黄鹤楼'); 
pNode.appendChild(tNode); 
//获取要替换的节点 
var reNode = document.getElementsByTagName('p')[0]; 
//这种方法只适用于IE浏览器 
//reNode.replaceNode(pNode, reNode); 
//适用于各种浏览器 
reNode.parentNode.replaceChild(pNode, reNode); 
} 
function reNode() { 
var oldNode = document.getElementsByTagName('p')[0]; 
//oldNode.parentNode返回的是p节点的父节点,这里就是body 
//然后使用body节点的removeChild方法删除下的oldNode节点 
oldNode.parentNode.removeChild(oldNode); 
} 
</script> 
</head> 
<body> 
<input id="Button1" type="button" value="创建节点" onclick="createNode()"/> 
<input id="Button2" type="button" value="替换节点" onclick="r()" /> 
<input id="Button3" type="button" value="删除节点" onclick="reNode()" /> 
</body> 
</html>
Javascript 相关文章推荐
jQuery 淡出一个图像到另一个图像的实现代码
Jun 12 Javascript
js实现网页标题栏闪烁提示效果实例分析
Nov 20 Javascript
JavaScript常用的返回,自动跳转,刷新,关闭语句汇总
Jan 13 Javascript
window.open()实现post传递参数
Mar 12 Javascript
简介AngularJS的HTML DOM支持情况
Jun 17 Javascript
jQuery右侧选项卡焦点图片轮播特效代码分享
Sep 05 Javascript
JQ选择器_选择同类元素的第N个子元素的实现方法
Sep 08 Javascript
删除table表格行的实例讲解
Sep 21 Javascript
JavaScript的Proxy可以做哪些有意思的事儿
Jun 15 Javascript
layui动态加载多表头的实例
Sep 05 Javascript
Element图表初始大小及窗口自适应实现
Jul 10 Javascript
解决vue cli4升级sass-loader(v8)后报错问题
Jul 30 Javascript
用函数模板,写一个简单高效的 JSON 查询器的方法介绍
Apr 17 #Javascript
JS对img进行操作(换图片/切图/轮换/停止)
Apr 17 #Javascript
用显卡加速,轻松把笔记本打造成取暖器的办法!
Apr 17 #Javascript
js跑马灯代码(自写)
Apr 17 #Javascript
获取元素距离浏览器周边的位置的方法getBoundingClientRect
Apr 17 #Javascript
动态加载js和css(外部文件)
Apr 17 #Javascript
关于在IE下的一个安全BUG --可用于跟踪用户的系统鼠标位置
Apr 17 #Javascript
You might like
分享PHP入门的学习方法
2007/01/02 PHP
一个PHP验证码类代码分享(已封装成类)
2011/07/17 PHP
PHP实现获取域名的方法小结
2014/11/05 PHP
PHP中strncmp()函数比较两个字符串前2个字符是否相等的方法
2016/01/07 PHP
php版微信公众平台实现预约提交后发送email的方法
2016/09/26 PHP
php分页查询mysql结果的base64处理方法示例
2017/05/18 PHP
javascript EXCEL 操作类代码
2009/07/30 Javascript
javascript 处理HTML元素必须避免使用的一种方法
2009/07/30 Javascript
Javascript 汉字字节判断
2009/08/01 Javascript
javascript定时变换图片实例代码
2013/03/17 Javascript
JavaScript回调(callback)函数概念自我理解及示例
2013/07/04 Javascript
基于javascript滚动图片具体实现
2013/11/18 Javascript
ext前台接收action传过来的json数据示例
2014/06/17 Javascript
setTimeout()递归调用不加引号出错的解决方法
2014/09/05 Javascript
Javascript实现的Map集合工具类完整实例
2015/07/31 Javascript
node.js回调函数之阻塞调用与非阻塞调用
2015/11/13 Javascript
Bootstrap组件学习之导航、标签、面包屑导航(精品)
2016/05/17 Javascript
js点击按钮实现水波纹效果代码(CSS3和Canves)
2016/09/15 Javascript
详解js运算符单竖杠“|”与“||”的用法和作用介绍
2016/11/04 Javascript
详解Vue.js基于$.ajax获取数据并与组件的data绑定
2017/05/26 Javascript
Bootstrap模态对话框中显示动态内容的方法
2018/08/10 Javascript
Python Requests 基础入门
2016/04/07 Python
Python探索之自定义实现线程池
2017/10/27 Python
pyQt4实现俄罗斯方块游戏
2018/06/26 Python
python解析多层json操作示例
2019/12/30 Python
基于python实现文件加密功能
2020/01/06 Python
Tensorflow tf.tile()的用法实例分析
2020/05/22 Python
Python爬虫实现selenium处理iframe作用域问题
2021/01/27 Python
MyBag中文网:英国著名的时尚包袋电商零售网站
2020/07/31 全球购物
王力宏牛津大学演讲稿
2014/05/22 职场文书
党员干部三严三实心得体会
2014/10/13 职场文书
python爬虫--selenium模块
2021/03/31 Python
Django展示可视化图表的多种方式
2021/04/08 Python
Vue OpenLayer测距功能的实现
2022/04/20 Vue.js
python绘制简单直方图(质量分布图)的方法
2022/04/21 Python
Python加密与解密模块hashlib与hmac
2022/06/05 Python