javascript --- 移除DOM节点
在IE中移除容器类节点,会引起内存泄露,最好是创建一个新的节点,比如div,然后将要删除的节点放入这个div中,再将div的innerHTML清空。其它的直接removeChild就可以了。
var removeNode = !+"\v1" ? function(){
var d;
return function(node){
if(node && node.tagName != 'BODY'){
d = d || document.createElement('DIV');
d.appendChild(node);
d.innerHTML = '';
}
}
}() : function(node){
if(node && node.parentNode && node.tagName != 'BODY'){
node.parentNode.removeChild(node);
}
}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>移除节点</title>
<script type="text/javascript">
var removeNode = !+"\v1" ? function(){
var d;
return function(node){
if(node && node.tagName != 'BODY'){
d = d || document.createElement('DIV');
d.appendChild(node);
d.innerHTML = '';
}
}
}() : function(node){
if(node && node.parentNode && node.tagName != 'BODY'){
node.parentNode.removeChild(node);
}
}
var remove = function(id){
var ddd = document.getElementById(id);
removeNode(ddd);
}
var check = function(id){
var ddd = document.getElementById(id);
alert(ddd);
}
</script>
<style type="text/css">
#ddd {
width:400px;
height:200px;
background:red;
}
#eee {
margin:20px;
width:300px;
height:100px;
background:blue;
}
</style>
</head>
<body>
<div id="ddd">
要去除的父元素
<div id="eee">
子元素
</div>
</div>
<button type="button" onclick="remove('ddd')">去除ddd元素</button><br />
<button type="button" onclick="check('ddd')">检测ddd元素是否存在</button><br />
<button type="button" onclick="remove('eee')">去除eee元素</button><br />
<button type="button" onclick="check('eee')">检测eee元素是否存在</button>
</body>
</html>
javascript --- 移除DOM节点的更多相关文章
- console.time 简单分析javascript动态加入Dom节点的性能
Bullshit 本来想每天都更新下博客的,可是近期要考试,还有就是自己还是停留在暗自窃喜中吧(这样的想法要改变). 事实上近期总在想.自己要怎么去管理自己的数据,每天的生活都是对自己的数据的增删查改 ...
- Javascript进阶篇——(DOM—节点---插入、删除和替换元素、创建元素、创建文本节点)—笔记整理
插入节点appendChild()在指定节点的最后一个子节点列表之后添加一个新的子节点.语法: appendChild(newnode) //参数: //newnode:指定追加的节点. 为ul添加一 ...
- Javascript进阶篇——(DOM—节点---属性、访问节点)—笔记整理
节点属性在文档对象模型 (DOM) 中,每个节点都是一个对象.DOM 节点有三个重要的属性 : 1. nodeName : 节点的名称 2. nodeValue :节点的值 3. nodeType : ...
- JavaScript获取HTML DOM节点元素详解(转)
在Web运用程序特别是Web 2.0程序开发中,经常要获取页面中某个元素,然后更新该元素的样式.内容等.如何获取要更新的元素,是首先要处理的疑问. 51CTO推荐阅读:JavaScript DOM文档 ...
- Javascript进阶篇——(DOM—节点---获取浏览器窗口可视区域大小+获取网页尺寸)—笔记整理
浏览器窗口可视区域大小获得浏览器窗口的尺寸(浏览器的视口,不包括工具栏和滚动条)的方法:一.对于IE9+.Chrome.Firefox.Opera 以及 Safari: • window.innerH ...
- JavaScript操作DOM节点
DOM (文档对象模型(Document Object Model)) 文档对象模型(Document Object Model,简称DOM),是W3C组织推荐的处理可扩展标志语言的标准编程接口.在网 ...
- javascript DOM 节点 第18节
<html> <head> <title>DOM对象</title> </head><body><div >DOM对 ...
- JavaScript DOM节点操作总结
节点类型 节点类型主要有三种:元素节点,属性节点和文本节点. 而对DOM的主要也就是围绕元素节点和属性节点的增删改查.下面就分别从对元素节点的操作和对属性节点的操作来介绍. 元素节点 查 在对DOM进 ...
- JavaScript学习笔记(三)——留言板知操纵DOM节点
用JavaScript写了一个简易的留言板,暂不涉及数据库接入等. 1.功能以及流程 主要功能即为留言,用两个文本框接受用户输入的用户名以及留言内容,然后通过"提交留言"按钮将用户 ...
随机推荐
- spring+struts2+hibernate框架依赖pom.xml
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/20 ...
- BZOJ 3257: 树的难题
树形DP #include<cstdio> #include<algorithm> #define rep(i,x,y) for (int i=x; i<=y; i++) ...
- activity-alias
activity-alias标签,它有一个属性叫android:targetActivity,这个属性就是用来为该标签设置目标Activity的,或者说它就是这个目标Activity的别名.至此我们已 ...
- 文件上传下载,命令之wget / curl / which / sort / uniq / cut / wc /tr /sed
目录 命令 1.文件的上传下载 2.从外网下载文件wget 3.curl文件下载 4.查找命令which 5.字符处理命令-排序sort 6.字符处理-去重uniq 7.字符处理-截取cut 8.字符 ...
- 解决debian 9 重启nameserver失效问题
目录 解决debian 9 重启nameserver失效问题 安装resolvconf 编辑文件 测试 解决debian 9 重启nameserver失效问题 刚安装完debian9,用过之后会发现/ ...
- bootstrap3兼容ie8浏览器
bootstrap3 兼容IE8浏览器 2016-01-22 14:01 442人阅读 评论(0) 收藏 举报 分类: html5(18) 目录(?)[+] 近期在使用bootstrap这 ...
- Policy-Based Reinforcement Learning
Policy-based Approach policy-based 强化学习通常是要学习一个actor, actor可以用\(\pi_\theta (S)\) 来确定.如果我们用actor来玩游戏, ...
- 聊聊、Java 网络编程
Socket 编程大家都不陌生,Java 学习中必学的部分,也是 Java网络编程核心内容之一.Java 网络编程又包括 TCP.UDP,URL 等模块.TCP 对应 Socket模块,UDP 对应 ...
- creat-react-app/dva静态项目,用nginx部署在次级域名路径(如a.com/sub/)需要注意的几点
因为要把dist文件夹部署在一个域名的次级目录,没想到和运维同学一起折腾了一下午.. 放在这里备忘,也给后来的同学一些可查的中文资料: 1,dva/cra给你的模板index.html是在public ...
- Codeforces Round #410 (Div. 2) A. Mike and palindrome
A. Mike and palindrome time limit per test 2 seconds memory limit per test 256 megabytes input stand ...