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 常用方法基础教程
Feb 06 Javascript
鼠标经过显示二级菜单js特效
Aug 13 Javascript
jQuery中detach()方法用法实例
Dec 25 Javascript
js对象继承之原型链继承实例
Jan 10 Javascript
js实现微信分享代码
Oct 11 Javascript
JavaScript通过代码调用Flash显示的方法
Feb 02 Javascript
jQuery实现简易的输入框字数计数功能示例
Jan 16 Javascript
angular实现form验证实例代码
Jan 17 Javascript
JavaScript实现换肤功能
Sep 15 Javascript
vue.js的computed,filter,get,set的用法及区别详解
Mar 08 Javascript
通过JavaScript下载文件到本地的方法(单文件)
Mar 17 Javascript
微信小程序之 catalog 切换实现解析
Sep 12 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
一首老MP3,致敬WAR3经典
2021/03/08 魔兽争霸
php数组对百万数据进行排除重复数据的实现代码
2010/06/08 PHP
php随机生成数字字母组合的方法
2015/03/18 PHP
原型方法的不同写法居然会影响调试的解决方法
2007/03/08 Javascript
JavaScript面向对象程序设计三 原型模式(上)
2011/12/21 Javascript
JavaScript 模拟类机制及私有变量的方法及思路
2013/07/10 Javascript
JavaScript实现的多种鼠标拖放效果
2015/11/03 Javascript
js 提取某()特殊字符串长度的实例
2017/12/06 Javascript
Vue自定义指令写法与个人理解
2019/02/09 Javascript
Vue组件内部实现一个双向数据绑定的实例代码
2019/04/04 Javascript
JS求解两数之和算法详解
2020/04/28 Javascript
python解析发往本机的数据包示例 (解析数据包)
2014/01/16 Python
Python找出文件中使用率最高的汉字实例详解
2015/06/03 Python
Python numpy 提取矩阵的某一行或某一列的实例
2018/04/03 Python
Python功能点实现:函数级/代码块级计时器
2019/01/02 Python
Python多线程threading模块用法实例分析
2019/05/22 Python
Python如何安装第三方模块
2020/05/28 Python
俄罗斯眼镜网: optikaworld
2016/07/31 全球购物
Guess美国官网:美国知名服装品牌
2019/04/08 全球购物
草莓网官网:StrawberryNET
2019/08/21 全球购物
.NET面试问题集
2015/12/08 面试题
请写出一段Python代码实现删除一个list里面的重复元素
2015/12/29 面试题
班长岗位职责
2013/11/10 职场文书
高中班长自我鉴定
2013/12/20 职场文书
中医专业职业生涯规划书范文
2014/01/04 职场文书
学雷锋志愿服务月活动总结
2014/03/09 职场文书
项目工作说明书
2014/07/29 职场文书
学雷锋的心得体会
2014/09/04 职场文书
学习十八届四中全会依法治国心得体会
2014/11/03 职场文书
重温入党誓词主持词
2015/06/29 职场文书
农村婚礼司仪主持词
2015/06/29 职场文书
地震捐款简报
2015/07/21 职场文书
2015年教师个人业务工作总结
2015/10/23 职场文书
PHP策略模式写法
2021/04/01 PHP
spring boot项目application.properties文件存放及使用介绍
2021/06/30 Java/Android
Java版 单机五子棋
2022/05/04 Java/Android