DOM节点删除函数removeChild()用法实例


Posted in Javascript onJanuary 12, 2015

本文实例讲述了DOM节点删除函数removeChild()用法。分享给大家供大家参考。具体分析如下:

DOM删除一个节点,必须要站在父节点的高度去删除,代码如下:

<html>

<head>

<script type="text/javascript">

function t(){

 //思路:1.首先找到要删除的节点;2. 找到它的父节点,在父节点的角度删除子节点

 var nodeul = document.getElementsByTagName('ul')[0];//找到父节点

 var li_lan = nodeul.children[2];//找到要删除的子节点

 nodeul.removeChild(li_lan);//使用removeChild()函数删除

}

</script>

</head>

<body>

<div id="container">

 <ul>

  <li>春天</li>

  <li>夏天</li>

  <li>蓝天</li>

  <li>秋天</li>

  <li>冬天</li>

 </ul>

</div>

<div id="copyul">

</div>

<hr />

<button onclick="t()" value="">删除一个子节点</button>

</body>

</html>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
javascript 触发事件列表 比较不错
Sep 03 Javascript
jQuery 使用手册(六)
Sep 23 Javascript
javascript开发随笔一 preventDefault的必要
Nov 25 Javascript
Js如何判断客户端是PC还是手持设备简单分析
Nov 22 Javascript
jquery判断元素是否隐藏的多种方法
May 06 Javascript
js获取IP地址的方法小结
Jul 01 Javascript
jquery实现简单的瀑布流布局
Dec 11 Javascript
JavaScript 限制文本框不可输入英文单双引号的方法
Dec 20 Javascript
vue2组件实现懒加载浅析
Mar 29 Javascript
js canvas实现QQ拨打电话特效
May 10 Javascript
JS中使用media实现响应式布局
Aug 04 Javascript
node.js基于fs模块对系统文件及目录进行读写操作的方法详解
Nov 10 Javascript
原生javascript实现图片弹窗交互效果
Jan 12 #Javascript
原生javascript实现图片按钮切换
Jan 12 #Javascript
原生javascript实现图片滚动、延时加载功能
Jan 12 #Javascript
DOM节点的替换或修改函数replaceChild()用法实例
Jan 12 #Javascript
原生javascript实现Tab选项卡切换功能
Jan 12 #Javascript
推荐4个原生javascript常用的函数
Jan 12 #Javascript
原生js实现日期联动
Jan 12 #Javascript
You might like
php防止伪造数据从地址栏URL提交的方法
2014/08/24 PHP
WordPress中编写自定义存储字段的相关PHP函数解析
2015/12/25 PHP
浅谈socket同步和异步、阻塞和非阻塞、I/O模型
2016/12/15 PHP
juqery 学习之三 选择器 层级 基本
2010/11/25 Javascript
判断访客终端类型集锦
2015/06/05 Javascript
js生成随机数的方法实例
2015/10/16 Javascript
基于jQuery实现select下拉选择可输入附源码下载
2016/02/03 Javascript
深入浅析JavaScript中with语句的理解
2016/05/12 Javascript
js验证真实姓名与身份证号,手机号的简单实例
2016/07/18 Javascript
最原始的jQuery注册验证方式
2016/10/11 Javascript
js实现炫酷的左右轮播图
2017/01/18 Javascript
利用Vue.js+Node.js+MongoDB实现一个博客系统(附源码)
2017/04/24 Javascript
ionic实现下拉刷新载入数据功能
2017/05/11 Javascript
angular中的cookie读写方法
2017/08/02 Javascript
weex slider实现滑动底部导航功能
2017/08/28 Javascript
vue+webpack实现异步加载三种用法示例详解
2018/04/24 Javascript
python中快速进行多个字符替换的方法小结
2016/12/15 Python
Python编程之gui程序实现简单文件浏览器代码
2017/12/08 Python
Python决策树之基于信息增益的特征选择示例
2018/06/25 Python
Python 从subprocess运行的子进程中实时获取输出的例子
2019/08/14 Python
Python如何生成xml文件
2020/06/04 Python
HTML5中FileReader接口使用方法实例详解
2017/08/26 HTML / CSS
翻新二手苹果产品的网络领导者:Mac of all Trades
2017/12/19 全球购物
Lacoste(法国鳄鱼)加拿大官网:以标志性的POLO衫而闻名
2019/05/15 全球购物
伦敦鲜花递送:Flower Station
2021/02/03 全球购物
汽车维修与检测专业应届生求职信
2013/11/12 职场文书
职专应届生求职信
2013/11/16 职场文书
工商干部先进事迹
2014/05/14 职场文书
个人主要事迹材料
2014/08/26 职场文书
2014银行授权委托书样本
2014/10/04 职场文书
幼师中班个人总结
2015/02/12 职场文书
《弟子规》读后感:知廉耻、明是非、懂荣辱、辨善恶
2019/12/03 职场文书
详解nginx.conf 中 root 目录设置问题
2021/04/01 Servers
草系十大最强宝可梦,纸片人上榜,榜首大家最熟悉
2022/03/18 日漫
MySQL数据库配置信息查看与修改方法详解
2022/06/25 MySQL
Springboot集成kafka高级应用实战分享
2022/08/14 Java/Android