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的复制网页内容到WORD的实现代码
Feb 16 Javascript
jquery右下角弹出提示框示例代码
Oct 08 Javascript
解决ueditor jquery javascript 取值问题
Dec 30 Javascript
js查找节点的方法小结
Jan 13 Javascript
js实现可兼容IE、FF、Chrome、Opera及Safari的音乐播放器
Feb 11 Javascript
如何编写jquery插件
Mar 29 jQuery
纯js实现页面返回顶部的动画(超简单)
Aug 10 Javascript
详解react-router 4.0 下服务器如何配合BrowserRouter
Dec 29 Javascript
js中Generator函数的深入讲解
Apr 07 Javascript
教你30秒发布一个TypeScript包到NPM的方法步骤
Jul 22 Javascript
vue中使用element组件时事件想要传递其他参数的问题
Sep 18 Javascript
node.js中 redis 的安装和基本操作示例
Feb 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从完整文件路径中分离文件目录和文件名的方法
2015/03/13 PHP
php+js实现百度地图多点标注的方法
2016/11/30 PHP
使用PHP下载CSS文件中的所有图片【几行代码即可实现】
2016/12/14 PHP
php的对象传值与引用传值代码实例讲解
2021/02/26 PHP
用jquery实现学校的校历(asp.net+jquery ui 1.72)
2010/01/01 Javascript
JS中三目运算符和if else的区别分析与示例
2014/11/21 Javascript
js实现鼠标滑过文字链接色彩变化的效果
2015/05/06 Javascript
JS简单循环遍历json数组的方法
2016/04/22 Javascript
ionic2 tabs使用 Modal底部tab弹出框
2016/12/30 Javascript
js实现复选框的全选和取消全选效果
2017/01/03 Javascript
原生js获取left值和top值的三种方法
2017/08/02 Javascript
基于Vue实现拖拽功能
2020/07/29 Javascript
微信小程序实现点击图片旋转180度并且弹出下拉列表
2018/11/27 Javascript
js中null与空字符串&quot;&quot;的区别讲解
2019/01/17 Javascript
Vue加载json文件的方法简单示例
2019/01/28 Javascript
微信小程序云开发修改云数据库中的数据方法
2019/05/18 Javascript
layui(1.0.9)文件上传upload,前后端的实例代码
2019/09/26 Javascript
three.js利用射线Raycaster进行碰撞检测
2020/03/12 Javascript
layui使用及简单的三级联动实现教程
2020/12/01 Javascript
Python标准库os.path包、glob包使用实例
2014/11/25 Python
利用python模拟实现POST请求提交图片的方法
2017/07/25 Python
Python读取指定日期邮件的实例
2019/02/01 Python
详解Python3除法之真除法、截断除法和下取整对比
2019/05/23 Python
python利用JMeter测试Tornado的多线程
2020/01/12 Python
动态设置django的model field的默认值操作步骤
2020/03/30 Python
python图片合成的示例
2020/11/09 Python
Lyle & Scott苏格兰金鹰官网:英国皇室御用品牌
2018/05/09 全球购物
自我鉴定书范文
2013/10/02 职场文书
护士辞职信模板
2014/01/20 职场文书
活动志愿者自荐信
2014/01/27 职场文书
教师求职自荐信
2014/03/09 职场文书
项目委托协议书(最新)
2014/09/13 职场文书
销售经理岗位职责范本
2015/04/02 职场文书
竞聘书的秘诀
2019/04/02 职场文书
php 解析非标准json、非规范json
2021/04/01 PHP
python文本处理的方案(结巴分词并去除符号)
2021/05/26 Python