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 解决“options为空或不是对象”
Dec 22 Javascript
JS定时刷新页面及跳转页面的方法
Jul 04 Javascript
jQuery标签替换函数replaceWith()的使用例子
Aug 28 Javascript
js鼠标点击图片实现随机变换图片的方法
Feb 16 Javascript
JQUERY实现网页右下角固定位置展开关闭特效的方法
Jul 27 Javascript
Javascript 计算字符串在localStorage中所占字节数
Oct 21 Javascript
学习AngularJs:Directive指令用法(完整版)
Apr 26 Javascript
Vue 父子组件、组件间通信
Mar 08 Javascript
微信小程序实现图片上传、删除和预览功能的方法
Dec 18 Javascript
浅谈webpack-dev-server的配置和使用
May 17 Javascript
Vue2.x中利用@font-size引入字体图标报错的解决方法
Sep 28 Javascript
Vue发布项目实例讲解
Jul 17 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
Discuz! 5.0.0论坛程序中加入一段js代码,让会员点击下载附件前自动弹出提示窗口
2007/04/18 PHP
PHP 编写的 25个游戏脚本
2009/05/11 PHP
ThinkPHP打开验证码页面显示乱码的解决方法
2014/12/18 PHP
php实现格式化多行文本为Js可用格式
2015/04/15 PHP
php 实现银联商务H5支付的示例代码
2019/10/12 PHP
html下载本地
2006/06/19 Javascript
Firebug 字幕文件JSON地址获取代码
2009/10/28 Javascript
为jquery.ui.dialog 增加“自动记住关闭时的位置”的功能
2009/11/24 Javascript
事件模型在各浏览器中存在差异
2010/10/20 Javascript
Javascript中定义方法的另类写法(批量定义js对象的方法)
2011/02/25 Javascript
jquery 年会抽奖程序
2011/12/22 Javascript
ASP.NET jQuery 实例15 通过控件CustomValidator验证CheckBoxList
2012/02/03 Javascript
关于在IE下的一个安全BUG --可用于跟踪用户的系统鼠标位置
2013/04/17 Javascript
javascript按位非运算符的使用方法
2013/11/14 Javascript
使用jquery解析XML的方法
2014/09/05 Javascript
JS或jQuery获取ASP.NET服务器控件ID的方法
2015/06/08 Javascript
AngularJS实现Model缓存的方式
2016/02/03 Javascript
Bootstrap自定义文件上传下载样式
2016/05/26 Javascript
Javascript json object 与string 相互转换的简单实现
2016/09/27 Javascript
浅谈js在html中的加载执行顺序,多个jquery ready执行顺序
2016/11/26 Javascript
用jQuery实现圆点图片轮播效果
2017/03/19 Javascript
JS Testing Properties 判断属性是否在对象里的方法
2017/10/01 Javascript
bootstrap可编辑下拉框jquery.editable-select
2017/10/12 jQuery
深入剖析JavaScript instanceof 运算符
2019/06/14 Javascript
vue 获取元素额外生成的data-v-xxx操作
2020/09/09 Javascript
JavaScript实现简易计算器小功能
2020/10/22 Javascript
Python自定义线程池实现方法分析
2018/02/07 Python
wxpython实现图书管理系统
2018/03/12 Python
使用Python3内置文档高效学习以及官方中文文档
2019/05/19 Python
Pycharm 2019 破解激活方法图文详解
2019/10/11 Python
详解background属性的8个属性值(面试题)
2020/11/02 HTML / CSS
2014年创卫实施方案
2014/02/18 职场文书
工作分析计划书
2014/04/30 职场文书
贷款委托书
2014/08/01 职场文书
HTML中table表格拆分合并(colspan、rowspan)
2021/04/07 HTML / CSS
MySQL视图概念以及相关应用
2022/04/19 MySQL