//最新更新: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. map内置函数分析所得到的思路

    map:会根据提供的函数对指定序列做映射. map(func, *iterables) --> map object Make an iterator that computes the fun ...

  2. BZOJ3998 TJOI2015弦论(后缀数组+二分答案)

    先看t=1的情况.显然得求出SA(因为我不会SAM).我们一位位地确定答案.设填到了第len位,二分这一位填什么之后,在已经确定的答案所在的范围(SA上的某段区间)内二分,找到最后一个小于当前串的后缀 ...

  3. Hdoj 2187.悼念512汶川大地震遇难同胞——老人是真饿了 题解

    时间:2008年5月16日(震后第4天) 地点:汶川县牛脑寨 人物:羌族老奶奶 [转载整理]牛脑寨是一个全村600多人的羌族寨子,震后几天,这里依然能常常听到隆隆的声音,那是对面山上石头不断滑落的声音 ...

  4. 自学Linux Shell1.2-Linux目录结构

    点击返回 自学Linux命令行与Shell脚本之路 1.2-Linux目录结构 /:  根目录,一般根目录下只存放目录,不要存放文件,/etc./bin./dev./lib./sbin应该和根目录放置 ...

  5. 架构师成长之路2.3-PXE+Kickstart无人值守大量部署Linux

    点击返回架构师成长之路 架构师成长之路2.3-PXE+Kickstart无人值守大量部署Linux 所谓的无人值守,就是自动应答,当安装过程中需要人机交互提供某些选项的答案时(如如何分区),自动应答文 ...

  6. hadoop文件配置

    伪分布式配置: core-site.xml <configuration> <property> <name>fs.defaultFS</name> & ...

  7. JDK源码分析(2)LinkedList

    JDK版本 LinkedList简介 LinkedList 是一个继承于AbstractSequentialList的双向链表.它也可以被当作堆栈.队列或双端队列进行操作. LinkedList 实现 ...

  8. SQL Server 查

    注:where语句是条件,后面加and或者or 时间日期:比时间需要时间加引号 模糊查询:where语句后面加like  '%包含此关键字%'或者'以此关键字开头%'或者'%结尾' 排序查询:列名 o ...

  9. [hihocoder1509][异或排序]

    hihocoder1509 思路 对于每两个数,从二进制的高位到低位考虑,发现,若前面一个的当前位是1,后面一个的当前位置是0,那么s的当前位置必须是1.反之,若前面是0,后面是1,那么s的当前位置必 ...

  10. 总算知道怎样从ImageMagick生成的数据转换成HICON: MagickGetImageBlob & LookupIconIdFromDirectoryEx

    MagickSetImageFormat(mw, "ICO"); //设置这个后, MagickGetImageBlob 才能返回正确的值 size_t length; PBYTE ...