原生js删除元素
//删除id
var idObject = document.getElementById('sidebar');
if (idObject != null)
idObject.parentNode.removeChild(idObject);
//通过class获取元素
paras = document.getElementsByClassName('paginator');
for(i=0;i<paras.length;i++){
//删除元素 元素.parentNode.removeChild(元素);
if (paras[i] != null)
paras[i].parentNode.removeChild( paras[i]);
}
//清空一个元素,即删除一个元素的所有子元素
function removeAllChild() {
var div = document.getElementById("div1");
while(div.hasChildNodes()) //当div下还存在子节点时 循环继续
{
div.removeChild(div.firstChild);
}
}
原理很简单,就是不断的判断要清空的div还有没有子节点,有的话就删除一个子节点(这里是它的首个子节点),直到删除完毕为止。
//封装的方法
function removeElement(_element){
var
_parentElement = _element.parentNode;
if(_parentElement){
_parentElement.removeChild(_element);
}
}
原生js删除元素的更多相关文章
- 原生js获取元素的样式信息
工作中经常会需要获取DOM元素的样式,之前都是通过jquery的css()方法,现在总结一下通过原生js获取元素样式的方法. obj.style js var _width = obj.style.w ...
- JavaScript DOM查询,原生js实现元素子节点的获取
在网页网页开发中,经常会需要获取某个网页元素的子元素,然后对其进行事件绑定.或样式修改等行为.这些操作对于jquery来说很容易,但是对于原生js会稍微麻烦一些,这里将介绍四种方法获取元素的子元素(本 ...
- 原生js获取元素样式
摘要: 我们在开发过程中经常会遇到通过js获取或者改变DOM元素的样式,方法有很多,比如:通过更改DOM元素的class.现在我们讨论原生js来获取DOM元素的CSS样式,注意是获取不是设置 在开始之 ...
- 今天 学习用到的一些知识(properties 读取,js 删除元素)
1.properties文件位置的关系:当properties文件放在src目录下时,编译会自动把src里的文件放到bin文件平级,因此可用this.getClass.getClassLoader.g ...
- 原生JS获取元素宽高实践详解
开篇的话 任何不是亲身实践中求得的知识,都不是属于你的.任何求得的知识不去时常温习运用,也不是属于你的. 记录由来 在做个上拉广告功能中遇到了一个"理所当然"觉得对的用法,慢慢才排 ...
- 原生JS获取元素集合的子元素宽度
有些时候,在一个网页的ul li中,存在左右两个部分的内容,但是右边元素内容又是不固定,左边元素相对应的不能用固定宽度,所有需要我们动态的获取右边元素宽度,来赋值给左边元素的marginRight值. ...
- 原生JS查找元素
今天写了一个很简单.很粗暴的通过JS根据类来查找DOM元素. 为了降低它的粗暴等级(耗费性能)我给了三个等级. 首先性能最好的,适合FF,CH,IE8,通过querySelectorAll这个API. ...
- 原生js获取元素的子元素
//使用firstChild //但是下面这种因为有空格,也算其子元素 <lable> <span id="onlinePerson" name="pe ...
- 原生js实现元素类名的判存、添加和移除
1.addClass:为指定的dom元素添加样式. 2.removeClass:删除指定dom元素的样式. 3.toggleClass:如果存在(不存在),就删除(添加)一个样式. 4.hasClas ...
随机推荐
- SpringMVC教程4
SpringMVC教程3 一.数据回写 数据回写:在做数据更新的时候服务端查询的数据自动填充到表单中. 1.1默认方式 通过前面讲解的 Map Mode ModelMap绑定数据 @RequestMa ...
- C# GDI+编程之剖析startAngle和sweepAngle
以DrawArc为例,它有一种形式如下的构造函数 public void DrawArc(Pen pen, Rectangle rect, float startAngle, float sweepA ...
- 如何简单快速的修改Bootstrap
Bootstrap并不是单单意味着HTML/CSS界面框架,更确切的说,它改变了整个游戏规则.这个囊括了应有尽有的代码框架使得许多应用和网站的设计开发变得简便许多,而且它将大量的HTML框架普及成了产 ...
- oracle与mysql
『创业团队最佳选择是Oracle+MongoDB,而不是MySQL』,当深蓝在QQ群里抛出这样的观点的时候,就像是在马蜂窝里丢了一串鞭炮一样热闹起来. 创业者甲: 开什么玩笑,Oracle要收钱的,太 ...
- cordova启动页面和图标的设置
一.config.xml配置 在cordova5.0版本以后,需要安装cordova-plugin-splashscreen插件以后才能修改和设置App的启动页面. 安装splashscreen插件: ...
- JavaScript复杂判断的更优雅写法
摘要: 写代码是一门艺术. 原文:JavaScript 复杂判断的更优雅写法 作者:Think. 公众号:大转转fe Fundebug经授权转载,版权归原作者所有. 前提 我们编写js代码时经常遇到复 ...
- JavaScript初学者必看“new”
译者按: 本文简单的介绍了new, 更多的是介绍原型(prototype),值得一读. 原文: JavaScript For Beginners: the 'new' operator 译者: Fun ...
- php 对象转数组
//参考网上 但是别人给的方法有错误的地方public function eleme_callback(){ $res = (object) array('1' => 'foo'); $data ...
- jquery之商城菜单
实现效果:悬浮总菜单,显示分类菜单,移走隐藏总菜单,悬浮分类菜单,显示商品种类,移走隐藏商品种类和分类菜单,悬浮商品种类,显示商品种类和分类菜单,移走隐藏商品菜单和分类菜单. 代码如下: <!D ...
- Spring Boot Oauth2缓存UserDetails到Ehcache
在Spring中有一个类CachingUserDetailsService实现了UserDetailsService接口,该类使用静态代理模式为UserDetailsService提供缓存功能.该类源 ...