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 事件属性绑定带参数的函数
Mar 13 Javascript
JavaScript 操作键盘的Enter事件(键盘任何事件),兼容多浏览器
Oct 11 Javascript
数组方法解决JS字符串连接性能问题有争议
Jan 12 Javascript
js单例模式详解实例
Nov 21 Javascript
JavaScript如何实现组合列表框中元素移动效果
Mar 01 Javascript
正则中的回溯定义与用法分析【JS与java实现】
Dec 27 Javascript
js通过指定下标或指定元素进行删除数组的实例
Jan 12 Javascript
基于JS脚本语言的基础语法详解
Jul 22 Javascript
React Native之TextInput组件解析示例
Aug 22 Javascript
小程序Request的另类用法详解
Aug 09 Javascript
JS实现水平移动与垂直移动动画
Dec 19 Javascript
前端如何实现动画过渡效果
Feb 05 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
fleaphp常用方法分页之Pager使用方法
2011/04/23 PHP
简单的php中文转拼音的实现代码
2014/02/11 PHP
基于Laravel 5.2 regex验证的正确写法
2019/09/29 PHP
区分JS中的undefined,null,&quot;&quot;,0和false
2007/03/08 Javascript
jQuery的写法不同导致的兼容性问题的解决方法
2010/07/29 Javascript
javascript学习笔记(二十) 获得和设置元素的特性(属性)
2012/06/20 Javascript
JavaScript两种跨域技术全面介绍
2014/04/16 Javascript
jQuery多级手风琴菜单实例讲解
2015/10/22 Javascript
继续学习javascript闭包
2015/12/03 Javascript
JavaScript-html标题滚动效果的简单实现
2016/09/08 Javascript
JS实现密码框的显示密码和隐藏密码功能示例
2016/12/26 Javascript
详解Angular的内置过滤器和自定义过滤器【推荐】
2016/12/26 Javascript
jQuery实现用户输入自动完成功能
2017/02/13 Javascript
AngularJS模糊查询功能实现代码(过滤内容下拉菜单排序过滤敏感字符验证判断后添加表格信息)
2017/10/24 Javascript
vue组件中使用props传递数据的实例详解
2018/04/08 Javascript
jQuery时间戳和日期相互转换操作示例
2018/12/07 jQuery
vue改变对象或数组时的刷新机制的方法总结
2019/04/24 Javascript
React Native 混合开发多入口加载方式详解
2019/09/23 Javascript
Bootstrap table 服务器端分页功能实现方法示例
2020/06/01 Javascript
python操作字典类型的常用方法(推荐)
2016/05/16 Python
python合并已经存在的sheet数据到新sheet的方法
2018/12/11 Python
用python一行代码得到数组中某个元素的个数方法
2019/01/28 Python
Tensorflow 多线程与多进程数据加载实例
2020/02/05 Python
基于Tensorflow高阶读写教程
2020/02/10 Python
Pycharm如何自动生成头文件注释
2020/11/14 Python
HTML5 层的叠加的实现
2020/07/07 HTML / CSS
Brasty波兰:香水、化妆品、手表网上商店
2019/04/15 全球购物
英国索普公园票务和酒店套餐:Thorpe Breaks
2019/09/14 全球购物
法国滑雪假期的专家:Ski Planet
2019/11/02 全球购物
园长自我鉴定
2013/10/06 职场文书
三分钟演讲稿范文
2014/04/24 职场文书
党的群众路线教育实践活动学习计划
2014/11/03 职场文书
师德承诺书
2015/01/20 职场文书
无工作证明怎么写
2015/06/15 职场文书
学校运动会开幕词
2016/03/03 职场文书
Go语言基础知识点介绍
2021/07/04 Golang