javascript删除一个html元素节点的方法


Posted in Javascript onDecember 20, 2014

本文实例讲述了利用原生javascript实现删除一个指定的html元素的方法。分享给大家供大家参考。具体实现方法如下:

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="https://3water.com/" />

<title>三水点靠木</title>

<style>

#content{

  width:200px;

  height:20px;

  color:red;

}

</style>

<script>

window.onload=function(){

  var obt=document.getElementById("bt");

  var odiv=document.getElementById("content");

  obt.onclick=function(){

    odiv.parentNode.removeChild(odiv);

  }

}

</script>

</head>

<body>

<div id="content">三水点靠木</div>

<input type="button" id="bt" value="查看效果"/>

</body>

</html>

在原生的javascript中,暂时没有没有一个方法能够删除元素本身,如果要删除可以通过通过父节点的removeChild()方法删除指定的子元素,代码比较简单,这里不多介绍了,感兴趣的朋友可以参阅相关资料。

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

Javascript 相关文章推荐
JavaScript 参考教程
Dec 29 Javascript
jQuery Validation插件remote验证方式的Bug解决
Jul 01 Javascript
qTip 基于JQuery的Tooltip插件[兼容性好]
Sep 01 Javascript
JavaScript继承方式实例
Oct 29 Javascript
jQuery插件开发详细教程
Jun 06 Javascript
jquery提示效果实例分析
Nov 25 Javascript
JS版元素周期表实现方法
Aug 05 Javascript
jQuery unbind 删除绑定事件详解
May 24 Javascript
js获取客户端操作系统类型的方法【测试可用】
May 27 Javascript
详解vue之页面缓存问题(基于2.0)
Jan 10 Javascript
JS触摸事件、手势事件详解
May 04 Javascript
Node.JS获取GET,POST数据之queryString模块使用方法详解
Feb 06 Javascript
Node.js中调用mysql存储过程示例
Dec 20 #Javascript
零基础搭建Node.js、Express、Ejs、Mongodb服务器及应用开发入门
Dec 20 #Javascript
jQuery多媒体插件jQuery Media Plugin使用详解
Dec 19 #Javascript
jquery图片播放浏览插件prettyPhoto使用详解
Dec 19 #Javascript
js中匿名函数的创建与调用方法分析
Dec 19 #Javascript
浅谈Javascript中匀速运动的停止条件
Dec 19 #Javascript
浅谈Javascript如何实现匀速运动
Dec 19 #Javascript
You might like
PHP写的加密函数,支持私人密钥(详细介绍)
2013/06/09 PHP
PHPStudy下如何为Apache安装SSL证书的方法步骤
2019/01/23 PHP
PHP7引入的&quot;??&quot;和&quot;?:&quot;的区别讲解
2019/04/08 PHP
javascript html 静态页面传参数
2009/04/10 Javascript
转换json格式的日期为Javascript对象的函数
2010/07/13 Javascript
Java 正则表达式学习总结和一些小例子
2012/09/13 Javascript
动态载入js提高网页打开速度的方法
2014/07/04 Javascript
PHP使用方法重载实现动态创建属性的get和set方法
2014/11/17 Javascript
详解js中构造流程图的核心技术JsPlumb(2)
2015/12/08 Javascript
angularJS之$http:与服务器交互示例
2017/03/17 Javascript
原生JS实现的轮播图功能详解
2018/08/06 Javascript
对于防止按钮重复点击的尝试详解
2019/04/22 Javascript
Python 流程控制实例代码
2009/09/25 Python
Python open()文件处理使用介绍
2014/11/30 Python
Python守护进程(daemon)代码实例
2015/03/06 Python
python登录pop3邮件服务器接收邮件的方法
2015/04/30 Python
Python 'takes exactly 1 argument (2 given)' Python error
2016/12/13 Python
Python简单定义与使用字典dict的方法示例
2017/07/25 Python
Python入门之三角函数全解【收藏】
2017/11/08 Python
python使用pygame框架实现推箱子游戏
2018/11/20 Python
Python使用正则表达式分割字符串的实现方法
2019/07/16 Python
Django 全局的static和templates的使用详解
2019/07/19 Python
使用pycharm在本地开发并实时同步到服务器
2019/08/02 Python
python使用celery实现异步任务执行的例子
2019/08/28 Python
Python代码块及缓存机制原理详解
2019/12/13 Python
Pytorch evaluation每次运行结果不同的解决
2020/01/02 Python
浅谈Tensorflow 动态双向RNN的输出问题
2020/01/20 Python
Selenium向iframe富文本框输入内容过程图解
2020/04/10 Python
Manuka Doctor英国官网:真正的麦卢卡蜂蜜和护肤品
2018/10/26 全球购物
办护照工作证明范本
2014/01/14 职场文书
小学数学教研活动总结
2014/07/01 职场文书
小学三八妇女节活动总结
2015/02/06 职场文书
2015年实习班主任工作总结
2015/04/23 职场文书
2015年医药代表工作总结
2015/04/25 职场文书
2015年宣传部个人工作总结
2015/05/14 职场文书
CSS 一行代码实现头像与国旗的融合
2021/10/24 HTML / CSS