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 相关文章推荐
Javascript 代码也可以变得优美的实现方法
Jun 22 Javascript
JQuery跨Iframe选择实现代码
Aug 19 Javascript
用js写了一个类似php的print_r输出换行功能
Feb 18 Javascript
JS对字符串编码的几种方式使用指南
May 14 Javascript
javascript实现动态表头及表列的展现方法
Jul 14 Javascript
JS中dom0级事件和dom2级事件的区别介绍
May 05 Javascript
JS调用Android、Ios原生控件
Jan 06 Javascript
解决vue中post方式提交数据后台无法接收的问题
Aug 11 Javascript
微信小程序按钮点击跳转页面详解
May 06 Javascript
vue 导航内容设置选中状态样式的例子
Nov 01 Javascript
vuejs实现下拉框菜单选择
Oct 23 Javascript
JavaScript实现表单验证功能
Dec 09 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命名空间学习详解
2014/02/27 PHP
php快递单号查询接口使用示例
2014/05/05 PHP
PHP 极验验证码实例讲解
2016/09/29 PHP
PHP7 安装event扩展的实现方法
2019/10/08 PHP
javascript void(0)的妙用
2009/10/21 Javascript
ExtJS DOM元素操作经验分享
2013/08/28 Javascript
JQuery弹出炫丽对话框的同时让背景变灰色
2014/05/22 Javascript
jQuery中hide()方法用法实例
2014/12/24 Javascript
JavaScript中的普通函数与构造函数比较
2015/04/07 Javascript
基于jQuery实现二级下拉菜单效果
2016/02/01 Javascript
Web前端新人笔记之jquery入门心得(新手必看)
2016/05/17 Javascript
vue项目中使用scss的方法步骤
2019/05/16 Javascript
layui实现左侧菜单点击右侧内容区显示
2019/07/26 Javascript
Python中使用不同编码读写txt文件详解
2015/05/28 Python
基于python 字符编码的理解
2017/09/02 Python
python+selenium实现163邮箱自动登陆的方法
2017/12/31 Python
PyQt5每天必学之滑块控件QSlider
2018/04/20 Python
django1.11.1 models 数据库同步方法
2018/05/30 Python
详解Python中的分组函数groupby和itertools)
2018/07/11 Python
python 实现目录复制的三种小结
2019/12/04 Python
Jupyter notebook 远程配置及SSL加密教程
2020/04/14 Python
Python常用外部指令执行代码实例
2020/11/05 Python
Hunter Boots美国官方网站:赫特威灵顿雨靴
2018/06/16 全球购物
澳大利亚最大的百货公司:Myer
2018/12/21 全球购物
Wallis官网:英国女装零售商
2020/01/21 全球购物
饮料业务员岗位职责
2013/12/15 职场文书
顶岗实习接收函
2014/01/09 职场文书
纪念建党演讲稿范文
2014/01/13 职场文书
工作自我评价怎么写
2014/01/29 职场文书
文秘人员工作职责
2014/01/31 职场文书
幼儿教师工作感言
2014/02/14 职场文书
音乐之声音乐广播稿
2014/09/10 职场文书
大二学生学年自我鉴定
2014/09/12 职场文书
小学运动会入场口号
2015/12/24 职场文书
MySQL创建高性能索引的全步骤
2021/05/02 MySQL
Windows10安装Apache2.4的方法步骤
2022/06/25 Servers