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 相关文章推荐
jquery multiSelect 多选下拉框
Jul 09 Javascript
从数据库读取数据后将其输出成html标签的三种方法
Oct 13 Javascript
javascript算法题:求任意一个1-9位不重复的N位数在该组合中的大小排列序号
Apr 01 Javascript
JavaScript、tab切换完整版(自动切换、鼠标移入停止、移开运行)
Jan 05 Javascript
javascript创建对象的几种模式介绍
May 06 Javascript
功能强大的Bootstrap效果展示(二)
Aug 03 Javascript
前端框架学习总结之Angular、React与Vue的比较详解
Mar 14 Javascript
jQuery插件artDialog.js使用与关闭方法示例
Oct 09 jQuery
Vue组件创建和传值的方法
Aug 17 Javascript
js的Object.assign用法示例分析
Mar 05 Javascript
uniapp电商小程序实现订单30分钟倒计时
Nov 01 Javascript
jquery实现图片放大镜效果
Dec 23 jQuery
原生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中mysql_connect与mysql_pconncet的区别详解
2013/05/15 PHP
Windows2003下php5.4安装配置教程(Apache2.4)
2016/06/30 PHP
Laravel中错误与异常处理的用法示例
2018/09/16 PHP
实例介绍PHP删除数组中的重复元素
2019/03/03 PHP
VBScript版代码高亮
2006/06/26 Javascript
ajax上传时参数提交不更新等相关问题
2012/12/11 Javascript
javascript实现客户端兼容各浏览器创建csv并下载的方法
2015/03/23 Javascript
基于jquery实现在线选座订座之影院篇
2015/08/24 Javascript
vue.js表格组件开发的实例详解
2016/10/12 Javascript
给easyui的datebox控件添加清空按钮的实现方法
2016/11/09 Javascript
巧用Javascript的逻辑运算符
2016/12/02 Javascript
JavaScript中数组Array.sort()排序方法详解
2017/03/01 Javascript
微信小程序之裁剪图片成圆形的实现代码
2018/10/11 Javascript
vue-router源码之history类的浅析
2019/05/21 Javascript
JavaScript事件循环及宏任务微任务原理解析
2020/09/02 Javascript
vue使用Sass时报错问题的解决方法
2020/10/14 Javascript
关于uniApp editor微信滑动问题
2021/01/15 Javascript
[55:25]VGJ.T vs Optic Supermajor小组赛D组 BO3 第三场 6.3
2018/06/04 DOTA
python爬虫入门教程之糗百图片爬虫代码分享
2014/09/02 Python
Python pickle类库介绍(对象序列化和反序列化)
2014/11/21 Python
Python的几个高级语法概念浅析(lambda表达式闭包装饰器)
2016/05/28 Python
使用Python中的tkinter模块作图的方法
2017/02/07 Python
使用Python抓取豆瓣影评数据的方法
2018/10/17 Python
查看jupyter notebook每个单元格运行时间实例
2020/04/22 Python
浅谈Python中threading join和setDaemon用法及区别说明
2020/05/02 Python
python中numpy数组与list相互转换实例方法
2021/01/29 Python
如何开启linux的ssh服务
2015/02/14 面试题
生物技术专业毕业生求职信范文
2013/12/14 职场文书
创先争优活动方案
2014/02/12 职场文书
学习决心书范文
2014/03/11 职场文书
给学校的建议书范文
2014/05/15 职场文书
党支部三会一课计划
2014/09/24 职场文书
2014乡镇干部对照检查材料思想汇报
2014/09/26 职场文书
国家助学贷款承诺书
2015/04/30 职场文书
关于迟到的检讨书
2015/05/06 职场文书
python处理json数据文件
2022/04/11 Python