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 特殊字符
Apr 05 Javascript
jQuery学习4 浏览器的事件模型
Feb 07 Javascript
jquery中获取元素的几种方式小结
Jul 05 Javascript
js实现汉字排序的方法
Jul 23 Javascript
Jquery实现$.fn.extend和$.extend函数
Apr 14 Javascript
如何利用JQuery实现从底部回到顶部的功能
Dec 27 Javascript
vue+vuex+axios+echarts画一个动态更新的中国地图的方法
Dec 19 Javascript
通过jquery toggleClass()属性制作文章段落更改背景颜色
May 21 jQuery
从vue源码看props的用法
Jan 09 Javascript
JS中的防抖与节流及作用详解
Apr 01 Javascript
vue实现todolist功能、todolist组件拆分及todolist的删除功能
Apr 11 Javascript
Vue使用localStorage存储数据的方法
May 27 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插入排序法实现数组排序实例
2015/02/16 PHP
php制作文本式留言板
2015/03/18 PHP
PHP的Yii框架的常用日志操作总结
2015/12/08 PHP
php遍历替换目录下文件指定内容的方法
2016/11/10 PHP
php实现的双色球算法示例
2017/06/20 PHP
用js判断用户浏览器是否是XP SP2的IE6
2007/03/08 Javascript
js电信网通双线自动选择技巧
2008/11/18 Javascript
JavaScript Cookie的读取和写入函数
2009/12/08 Javascript
CheckBoxList多选样式jquery、C#获取选择项
2013/09/06 Javascript
js确认删除对话框适用于a标签及submit
2014/07/10 Javascript
理解Javascript的call、apply
2015/12/16 Javascript
浅谈JS正则表达式的RegExp对象和括号的使用
2016/07/28 Javascript
JQuery遍历元素的后代和同胞实现方法
2016/09/18 Javascript
jQuery模拟淘宝购物车功能
2017/02/27 Javascript
详解webpack分包及异步加载套路
2017/06/29 Javascript
在vue-cli脚手架中配置一个vue-router前端路由
2017/07/03 Javascript
JS实现预加载视频音频/视频获取截图(返回canvas截图)
2017/10/09 Javascript
利用SpringMVC过滤器解决vue跨域请求的问题
2018/02/10 Javascript
vue的常用组件操作方法应用分析
2018/04/13 Javascript
[43:51]2018DOTA2亚洲邀请赛3月30日 小组赛B组 EG VS Secret
2018/03/31 DOTA
Python字符串中查找子串小技巧
2015/04/10 Python
python实现八大排序算法(1)
2017/09/14 Python
使用python根据端口号关闭进程的方法
2018/11/06 Python
在python里面运用多继承方法详解
2019/07/01 Python
Python selenium自动化测试模型图解
2020/04/15 Python
Python模拟登入的N种方式(建议收藏)
2020/05/31 Python
解决pycharm修改代码后第一次运行不生效的问题
2021/02/06 Python
使用canvas绘制贝塞尔曲线
2014/12/17 HTML / CSS
英国马莎百货官网:Marks & Spencer
2016/07/29 全球购物
卫校中专生个人自我评价
2013/09/19 职场文书
建筑工程管理专业自荐信范文
2013/12/28 职场文书
服装设计专业自荐信
2014/06/17 职场文书
新教师个人工作总结
2015/02/06 职场文书
2015年安全保卫工作总结
2015/05/14 职场文书
2016年党支部公开承诺书
2016/03/25 职场文书
Python实现提取PDF简历信息并存入Excel
2022/04/02 Python