Javascript删除指定元素节点的方法
更新时间：2016年06月21日 11:25:44 作者：沫鱼
这篇文章主要介绍了使用Javascript删除指定元素节点的方法,通俗易懂,需要的朋友可以参考下。
在javascript操作dom树的时候可能会经常遇到增加，删除节点的事情，比如一个输入框后一个增加按钮，一个删除按钮，点击增加就增加 个输入框，点击删除就删除对应的输入框。在一些js框架，如Prototype中，可以用element.remove()来删除一个节点，核心JS中并 没有这样的方法，IE中有这样一个方法:removeNode()，尝试运行下面的代码
<div><input onclick="removeNode(this)" type="text" value="点击移除该输入框" /></div>
可以发现，这个方法在IE下是好使的，但是在Firefox等标准浏览器中就会报错了 removeNode is not defined，但是在核心JS中有一个操作DOM节点的方法叫：removeChild()，看名字应该就知道是移除子节点的，那么我们就可以变通一下 来实现移除指定的节点了，我们可以先去找到要删除节点的父节点，然后在父节点中运用removeChild来移除我们想移除的节点。我们可以定义一个方 法，就叫removeElement吧。
function removeElement(_element){
var _parentElement = _element.parentNode;
if(_parentElement){
_parentElement.removeChild(_element);
}
}
尝试运行下面的代码，可以在各种浏览器中正确执行了。
<script type="text/javascript">
function removeElement(_element){
var _parentElement = _element.parentNode;
if(_parentElement){
_parentElement.removeChild(_element);
}
}
</script>
<div><input onclick="removeElement(this)" type="text" value="点击移除该输入框" /></div>
以上就是本文的全部内容，了解更多JavaScript的语法，大家可以查看：《JavaScript 参考教程》、《JavaScript代码风格指南》，也希望大家多多支持脚本之家。
相关文章
面向对象的语言有一个标志，即拥有类的概念，抽象实例对象的公共属性与方法，基于类可以创建任意多个实例对象，一般具有封装、继承、多态的特性！但JS中对象与纯面向对象语言中的对象是不同的，ECMA标准定义JS中对象：无序属性的集合，其属性可以包含基本值、对象或函数2015-11-11
JavaScript 的管道是一个运算符，写作|>，它的左边是一个表达式，右边是一个函数，这篇文章主要介绍了ES6中的管道运算符，需要的朋友可以参考下2023-05-05
这篇文章主要为大家详细介绍了微信小程序自定义底部导航栏组件，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-10-10
前一篇记录了Grunt的安装，这篇介绍下怎么使用Gruntjs来搭建一个前端项目，然后使用grunt合并，压缩JS文件。2014-06-06
这篇文章主要为大家详细介绍了JavaScript实现弹出窗口效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2020-12-12
有这么一个需求，开发了一套系统，当用户离开桌面或者一段时间不操作的话，需要把该系统所有打开页面锁定起来，本文就详细的介绍一下，感兴趣的可以了解一下2021-06-06
这篇文章主要介绍了使用js绘制几何图形系列教程的绘制饼图篇,需要的朋友可以参考下2015-01-01
不管是哪门语言,千变万化不离其宗,深入理解其本质,方能应用自如,下面这篇文章主要给大家介绍了关于js中常见的4种创建对象方式与优缺点,文中通过实例代码介绍的非常详细,需要的朋友可以参考下2022-01-01
ES6中为我们提供了很多好用的新特性,其中包括let,箭头函数以及扩展运算符…等，以下就是总结的常用基础知识2019-02-02
document.createElement()用法及注意事项(ff下不兼容)
今天处理了一个日期选择器的ie和ff的兼容问题，本来这种情况就很难找错误，找了好久才把错误定位到js中创建元素的方法document.createElement()，这个方法在ie下支持这样创建元素2013-03-03
最新评论