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 相关文章推荐
JS实现浏览器菜单命令
Sep 05 Javascript
jquery提示 &quot;object expected&quot;的解决方法
Dec 13 Javascript
js循环改变div颜色具体方法
Jun 25 Javascript
JS弹出层单纯的绝对定位居中示例代码
Feb 18 Javascript
jQuery瀑布流插件Wookmark使用实例
Apr 02 Javascript
javascript的几种写法总结
Sep 30 Javascript
基于Bootstrap的Java开发问题汇总(Spring MVC)
Jan 15 Javascript
ES6使用Set数据结构实现数组的交集、并集、差集功能示例
Oct 31 Javascript
vue2.0 循环遍历加载不同图片的方法
Mar 06 Javascript
转换layUI的数据表格中的日期格式方法
Sep 19 Javascript
使用Vant完成DatetimePicker 日期的选择器操作
Nov 12 Javascript
vue el-table实现递归嵌套的示例代码
Aug 14 Vue.js
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
PHP4实际应用经验篇(8)
2006/10/09 PHP
PHP setcookie设置Cookie用法(及设置无效的问题)
2011/07/13 PHP
php实现redis数据库指定库号迁移的方法
2015/01/14 PHP
DWZ+ThinkPHP开发时遇到的问题分析
2016/12/12 PHP
如何用js控制frame的隐藏或显示的解决办法
2013/03/20 Javascript
A标签触发onclick事件而不跳转的多种解决方法
2013/06/27 Javascript
javascript教程:关于if简写语句优化的方法
2014/05/17 Javascript
2014 HTML5/CSS3热门动画特效TOP10
2014/12/07 Javascript
JavaScript实现自动消除按钮功能的方法
2015/08/05 Javascript
JS+CSS实现的经典tab选项卡效果代码
2015/09/16 Javascript
JS实现网页每隔3秒弹出一次对话框的方法
2015/11/09 Javascript
不想让浏览器运行javascript脚本的方法
2015/11/20 Javascript
jQuery Mobile 触摸事件实例
2016/06/04 Javascript
js 动态给元素添加、移除事件的实现方法
2016/07/19 Javascript
在html中引入外部js文件,并调用带参函数的方法
2016/10/31 Javascript
javascript中的深复制详解及实例分析
2016/12/29 Javascript
深入理解js中的加载事件
2017/02/08 Javascript
Bootstrap列表组学习使用
2017/02/09 Javascript
基于vue.js实现侧边菜单栏
2017/03/20 Javascript
微信小程序 input输入及动态设置按钮的实现
2017/10/27 Javascript
js函数柯里化的方法和作用实例分析
2020/04/11 Javascript
[03:37]2014DOTA2国际邀请赛 主赛事第一日胜者组TOPPLAY
2014/07/19 DOTA
[03:35]2018年度DOTA2最佳辅助位选手5号位-完美盛典
2018/12/17 DOTA
Python实现线程池代码分享
2015/06/21 Python
matplotlib在python上绘制3D散点图实例详解
2017/12/09 Python
Python读取Json字典写入Excel表格的方法
2018/01/03 Python
python实现统计代码行数的小工具
2019/09/19 Python
python文件操作的简单方法总结
2019/11/07 Python
PyTorch实现ResNet50、ResNet101和ResNet152示例
2020/01/14 Python
Python 测试框架unittest和pytest的优劣
2020/09/26 Python
特步官方商城:Xtep
2017/03/21 全球购物
Kathmandu英国网站:新西兰户外运动品牌
2017/03/27 全球购物
学生会干部自荐信
2014/02/04 职场文书
党员入党表决心的话
2014/03/11 职场文书
疾病捐款倡议书
2014/05/13 职场文书
抗洪救灾感谢信
2015/01/22 职场文书