原生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 ...
随机推荐
- Struts2学习(五)———— s标签和国际化
一.s标签 在struts-2.3.15.1/docs/WW/docs/tag-reference.html下,就有着struts2所有标签的参考文献,只能看看其中比较常用的标签.其他的以后遇到了在看 ...
- 使用css的-moz-element()把html元素当背景图片去
background:-moz-element(id)定义了一个从任意HTML元件产生的值.此图像是实时的,这意味着如果更改了HTML元素,则会自动更新使用结果值的CSS属性.element() &l ...
- 绕过边界防火墙之ICMP隧道、HTTP隧道、UDP隧道
一.ICMP隧道 背景:已经通过某种手段拿到了园区网A主机的控制权,但是边界防火墙只放行该主机向外的ICMP流量,此时怎样才能让A主机和公网主机C建立TCP连接呢? 方案:将TCP包内容包裹在ICMP ...
- python取余
a=-7,b=3, a % b = 2 #取余 a-((a/b)*b) a / b= -3 #整除 int(math.floor(-7/3.0))
- 【github&&git】3、git图像化界面GUI的使用
GIT学习笔记 一. 基础内容 1.git是一个版本控制软件,与svn类似,特点是分布式管理,不需要中间总的服务器,可以增加很多分支. 2.windows下的git叫msysgit,下载 ...
- IDEA出现Cannot resolve symbol "xxx"(无法解析符号)
在导入一些包的时候出现报错 1.File->Invalidate Caches/Restart 清除缓存并重启 idea2.检查pom文件中的依赖关系是否正确3.maven -> Reim ...
- canvas-4fillstyle.html
fillStyle color gradient pattern image canvas video strokeStyle
- canvas-5Bezier-QuadraticCurveTo.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- JS中的数学方法
1 . Math.ceil() 向上取整 2. Math.floor() 向下取整 3. Math.round() 四舍五入取整 4. Math.random() 生成 ...
- 【代码笔记】Web-ionic-按钮
一,效果图. 二,代码.index.html文件如下所示. <!DOCTYPE html> <html> <head> <meta charset=" ...