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 一行代码,轻松搞定浮动快捷留言-V2升级版
Apr 02 Javascript
javascript实现依次输入input自动定焦
Dec 23 Javascript
jquery.mobile 共同布局遇到的问题小结
Feb 10 Javascript
举例讲解jQuery中可见性过滤选择器的使用
Apr 18 Javascript
jQuery封装的屏幕居中提示信息代码
Jun 08 Javascript
JavaScript中Form表单技术汇总(推荐)
Jun 26 Javascript
vuejs动态组件给子组件传递数据的方法详解
Sep 09 Javascript
详解JavaScript中的六种错误类型
Sep 21 Javascript
vue实现条件判断动态绑定样式的方法
Sep 29 Javascript
layui问题之渲染数据表格时,仅出现10条数据的解决方法
Sep 12 Javascript
javascript设计模式 ? 装饰模式原理与应用实例分析
Apr 14 Javascript
Vue实现手机计算器
Aug 17 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(2)
2006/10/09 PHP
什么是MVC,好东西啊
2007/05/03 PHP
PHP自动生成后台导航网址的最佳方法
2013/08/27 PHP
smarty中post用法实例
2014/11/28 PHP
php判断linux下程序问题实例
2015/07/09 PHP
php实现微信企业转账功能
2018/10/02 PHP
让网页跳转到指定位置的jquery代码非书签
2013/09/06 Javascript
用jquery方法操作radio使其默认选项是否
2013/09/10 Javascript
jquery的ajax跨域请求原理和示例
2014/05/08 Javascript
JQuery跳出each循环的方法
2015/04/16 Javascript
javascript实现拖动元素交换位置
2015/11/29 Javascript
动态创建按钮的JavaScript代码
2016/01/29 Javascript
Three.js学习之文字形状及自定义形状
2016/08/01 Javascript
遍历js中对象的属性和值的实例
2016/11/21 Javascript
ES6深入理解之“let”能替代”var“吗?
2017/06/28 Javascript
解决vue中使用proxy配置不同端口和ip接口问题
2019/08/14 Javascript
three.js利用gpu选取物体并计算交点位置的方法示例
2019/11/25 Javascript
基于Element封装一个表格组件tableList的使用方法
2020/06/29 Javascript
[03:59]5分钟带你了解什么是DOTA2(第二期)
2017/02/07 DOTA
[01:07:21]NAVI vs VG Supermajor 败者组 BO3 第二场 6.5
2018/06/06 DOTA
使用Python的Tornado框架实现一个Web端图书展示页面
2016/07/11 Python
Python实现线程状态监测简单示例
2018/03/28 Python
Python实现定时执行任务的三种方式简单示例
2019/03/30 Python
Python中调用其他程序的方式详解
2019/08/06 Python
Python使用socketServer包搭建简易服务器过程详解
2020/06/12 Python
python模块如何查看
2020/06/16 Python
Python Selenium自动化获取页面信息的方法
2020/08/31 Python
python 利用zmail库发送邮件
2020/09/11 Python
python 5个实用的技巧
2020/09/27 Python
python使用正则表达式匹配txt特定字符串(有换行)
2020/12/09 Python
美国知名日用品连锁超市:Dollar General(多来店)
2017/01/14 全球购物
波兰运动鞋网上商店:e-Sporting
2018/02/16 全球购物
Lulu & Georgia官方网站:购买地毯、家具、抱枕、壁纸、床上用品等
2018/03/19 全球购物
Quiksilver美国官网:始于1969年的优质冲浪服和滑雪板外套
2020/04/20 全球购物
高级工程师岗位职责
2013/12/15 职场文书
公司出差管理制度范本
2015/08/05 职场文书