JavaScript之Dom操作【删除当前节点】
//最新更新:2017-11-25
//现在可以通过更强大而快捷的方式为所有的HTMLElement元素的Dom操作扩展新的方法【注意事项:处理HTMLElemnt元素时,此法对IE-8无效】
//原理:原型 (function(){
HTMLElement.prototype.remove = function(){
if(this.parentNode){
this.parentNode.removeChild(this);
}
}
})(); //demo
var div = document.createElement("div");
div.setAttribute("id","demo");
div.innerText = "hello";
document.body.append(div);
//div.remove();
传统方式:
document.getElementById("test").parentNode.removeChild(document.getElementById("test"));
function removeById(Id){
document.getElementById(Id).parentNode.removeChild(document.getElementById(Id))
}
function removeByClassName(classNames,indexs){ for(var i = 0;i<classNames.length;i++){
document.getElementsByClassName(classNames[i])[indexs[i]].parentNode.removeChild(document.getElementsByClassName(classNames[i])[indexs[i]]
); } }
以清理百度文库为例:
step0:将文档全部页面都在网页上展开
step1:点击文库的全屏图标
step2:
clear();
function removeById(Id){
document.getElementById(Id).parentNode.removeChild(document.getElementById(Id))
}
function removeByClassName(classNames,indexs){
for(var i = 0;i<classNames.length;i++){
document.getElementsByClassName(classNames[i])[indexs[i]].parentNode.removeChild(document.getElementsByClassName(classNames[i])[indexs[i]]);
}
}
removeById("next_doc_box");
removeByClassName(["fix-searchbar-wrap","reader-tools-bar-wrap","pay-page-mod","ft","footer","new-ico-wkmember-free-doc"],[0,0,0,0,0,0]);
JavaScript之Dom操作【删除当前节点】的更多相关文章
- 第一百一十六节,JavaScript,DOM操作样式
JavaScript,DOM操作样式 一.操作样式 CSS作为(X)HTML的辅助,可以增强页面的显示效果.但不是每个浏览器都能支持最新的CSS能力.CSS的能力和DOM级别密切相关,所以我们有必要检 ...
- 第一百一十五节,JavaScript,DOM操作表格
JavaScript,DOM操作表格 学习要点: 1.操作表格 DOM在操作生成HTML上,还是比较简明的.不过,由于浏览器总是存在兼容和陷阱,导致最终的操作就不是那么简单方便了.本章主要了解一下DO ...
- Python之路day13 web 前端(JavaScript,DOM操作)
参考链接:http://www.cnblogs.com/wupeiqi/articles/5433893.html day13 1. CSS示例 2. JavaScript 3. DOM操作 上节内容 ...
- 网站开发综合技术 三 JavaScript的DOM操作
第3部分 JavaScript的DOM操作 1.DOM的基本概念 DOM是文档对象模型,这种模型为树模型:文档是指标签文档:对象是指文档中每个元素:模型是指抽象化的东西. 2.Windows对象操作 ...
- JavaScript的DOM操作(节点操作)
创建节点createElement()var node = document.createElement(“div”);没什么可说的,创建一个元素节点,但注意,这个节点不会被自动添加到文档(docum ...
- JavaScript之DOM操作,事件操作,节点操作
1,DOM操作 1.1 概念 所谓DOM,全称Document Object Model 文档对象模型,DOM是W3C(World Wide Web Consortuum )标准,同时也定义了访问诸 ...
- JavaScript 的DOM操作详解
内容概要 DOM之查找标签 基本查找 间接查找 节点操作 获取值操作 class操作 样式操作 事件 内置参数this 事件练习 内容详细 DOM操作 DOM(Document Object Mode ...
- Javascript的DOM操作 - 你真的了解吗?
摘要 想稍微系统的说说对于DOM的操作,把Javascript和jQuery常用操作DOM的内容归纳成思维导图方便阅读,同时加入性能上的一些问题. 前言 在前端开发的过程中,javascript极为重 ...
- JavaScript原生DOM操作API总结
最近面试的时候被这个问题给卡了,所以抽时间好好复习一下. 原文:http://www.cnblogs.com/liuxianan/p/javascript-dom-api.html 几种对象 Node ...
随机推荐
- ssm 整合 redis(进阶教程)
最后我建议大家使用 Spring StringRedisTemplate 配置,参阅: http://blog.csdn.net/hanjun0612/article/details/78131333 ...
- Wordpress 之删除 RSS 功能 的"文章RSS"、"评论RSS"、"WordPress.org"
一. 去除底部“自豪地采用 WordPress”版权信息: 1.打开主题文件夹:wp-content/themes/twentyeleven/footer.php; 2.找到 这段代码 删除即可: & ...
- 【BZOJ3551】【BZOJ3545】 【ONTAK2010】 Peaks (kruskal重构树+主席树)
Description 在\(Bytemountains\)有\(~n~\)座山峰,每座山峰有他的高度\(~h_i~\). 有些山峰之间有双向道路相连,共\(~m~\)条路径,每条路径有一个困难值 ...
- 恕我直言,在座的各位根本写不好Java!
其实,本不想把标题写的那么恐怖,只是发现很多人干了几年 Java 以后,都自认为是一个不错的 Java 程序员了,可以拿着上万的工资都处宣扬自己了,写这篇文章的目的并不是嘲讽和我一样做 Java 的同 ...
- 丢手帕问题 (约瑟夫问题)Java实现
问题: 丢手帕游戏是约瑟夫问题的一个变种,游戏很简单,N个小孩围成一个圈,标号为1到N,从编号为m的小孩开始报数,报到第L个小孩退出游戏,然后下一个小孩继续从1开始报数,数到第L个小孩退出游戏,如此循 ...
- 【bzoj1507】 JSOI2008—Blue Mary的旅行
http://www.lydsy.com/JudgeOnline/problem.php?id=1570 (题目链接) 题意 给出$m$个航班,每天只能做一次飞机,有$T$人从起点到终点,问最晚到达的 ...
- luogu P4198 楼房重建——线段树
题目大意: 小A在平面上(0,0)点的位置,第i栋楼房可以用一条连接(i,0)和(i,Hi)的线段表示,其中Hi为第i栋楼房的高度.如果这栋楼房上任何一个高度大于0的点与(0,0)的连线没有与之前的线 ...
- JAVA8给我带了什么——流的概念和收集器
到现在为止,笔者不敢给流下定义,从概念来讲他应该也是一种数据元素才是.可是在我们前面的代码例子中我们可以看到他更多的好像在表示他是一组处理数据的行为组合.这让笔者很难去理解他的定义.所以笔者不表态.各 ...
- A1073. Scientific Notation
Scientific notation is the way that scientists easily handle very large numbers or very small number ...
- eclipse --- 新建JSP页面默认模版设置
设置 在eclipse中新建 jsp时是这样的: 有时候我们不想字符集是ISO_8859-1,想字符集是UTF-8,一个个修改会很麻烦,那么我们可以修改jsp模版的设置: window>Pref ...