//最新更新: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操作【删除当前节点】的更多相关文章

  1. 第一百一十六节,JavaScript,DOM操作样式

    JavaScript,DOM操作样式 一.操作样式 CSS作为(X)HTML的辅助,可以增强页面的显示效果.但不是每个浏览器都能支持最新的CSS能力.CSS的能力和DOM级别密切相关,所以我们有必要检 ...

  2. 第一百一十五节,JavaScript,DOM操作表格

    JavaScript,DOM操作表格 学习要点: 1.操作表格 DOM在操作生成HTML上,还是比较简明的.不过,由于浏览器总是存在兼容和陷阱,导致最终的操作就不是那么简单方便了.本章主要了解一下DO ...

  3. Python之路day13 web 前端(JavaScript,DOM操作)

    参考链接:http://www.cnblogs.com/wupeiqi/articles/5433893.html day13 1. CSS示例 2. JavaScript 3. DOM操作 上节内容 ...

  4. 网站开发综合技术 三 JavaScript的DOM操作

    第3部分 JavaScript的DOM操作 1.DOM的基本概念 DOM是文档对象模型,这种模型为树模型:文档是指标签文档:对象是指文档中每个元素:模型是指抽象化的东西. 2.Windows对象操作 ...

  5. JavaScript的DOM操作(节点操作)

    创建节点createElement()var node = document.createElement(“div”);没什么可说的,创建一个元素节点,但注意,这个节点不会被自动添加到文档(docum ...

  6. JavaScript之DOM操作,事件操作,节点操作

    1,DOM操作 1.1  概念 所谓DOM,全称Document Object Model 文档对象模型,DOM是W3C(World Wide Web Consortuum )标准,同时也定义了访问诸 ...

  7. JavaScript 的DOM操作详解

    内容概要 DOM之查找标签 基本查找 间接查找 节点操作 获取值操作 class操作 样式操作 事件 内置参数this 事件练习 内容详细 DOM操作 DOM(Document Object Mode ...

  8. Javascript的DOM操作 - 你真的了解吗?

    摘要 想稍微系统的说说对于DOM的操作,把Javascript和jQuery常用操作DOM的内容归纳成思维导图方便阅读,同时加入性能上的一些问题. 前言 在前端开发的过程中,javascript极为重 ...

  9. JavaScript原生DOM操作API总结

    最近面试的时候被这个问题给卡了,所以抽时间好好复习一下. 原文:http://www.cnblogs.com/liuxianan/p/javascript-dom-api.html 几种对象 Node ...

随机推荐

  1. appium学习记录1

    xpath定位: 语法 driver.find_element_by_xpath("//android.widget.EditText[@index="登陆"/../pr ...

  2. @classmethod 与 @staticmethod 区别

  3. 洛谷P4088 [USACO18FEB]Slingshot

    题面 大意:给出n个弹弓,可以用ti的时间把xi位置运到yi,在给出m组询问,求xj到yj最小时间. sol:首先如果不用弹弓,时间应为abs(xj-yj).否则时间就是abs(xi-xj)+abs( ...

  4. BZOJ4386[POI2015]Wycieczki——矩阵乘法+倍增

    题目描述 给定一张n个点m条边的带权有向图,每条边的边权只可能是1,2,3中的一种.将所有可能的路径按路径长度排序,请输出第k小的路径的长度,注意路径不一定是简单路径,即可以重复走同一个点. 输入 第 ...

  5. float 、double 加减乘除出现小数位多出的问题

    /** * 提供精確的加法運算 * @param args */ public static double add(double v1, double v2) { BigDecimal b1 = ne ...

  6. Ambiguous handler methods mapped for HTTP

    前端访问的 controller 地址没有加方法名导致找不到. Servlet.service() for servlet [spring] in context with path [/ssmDem ...

  7. Hdoj 1009.FatMouse' Trade 题解

    Problem Description FatMouse prepared M pounds of cat food, ready to trade with the cats guarding th ...

  8. [luogu4265][USACO18FEB]Snow Boots silver

    题目大意 求出最少需要丢去多少双靴子才能到达终点. 解法 解法一: 看到数据的范围,非常清楚\(O(n^3)\)能过掉所有的数据,那么我们就果断暴力. 解法二: 比较容易会想到用DP做,我一开始定义\ ...

  9. KEIL打开的工程所在目录过深将会编译出错

    这是一个工程所在目录过深导致的编译错误

  10. 洛谷 P4211 [LNOI2014]LCA 解题报告

    [LNOI2014]LCA 题意 给一个\(n(\le 50000)\)节点的有根树,询问\(l,r,z\),求\(\sum_{l\le i\le r}dep[lca(i,z)]\) 一直想启发式合并 ...