# [在线预览](https://jsfiddle.net/1010543618/fyf913t0/)

## 方法

- 使用《Web API 接口》的《MutationObserver》
[MutationObserver](https://developer.mozilla.org/zh-CN/docs/Web/API/MutationObserver)

网上查到的很多都是使用 Mutation events 的,但在 MDN 上一查这个事件已经废弃了,并且推荐用 MutationObserver 替换掉

> Deprecated
> This feature has been removed from the Web standards. Though some browsers may still support it, it is in the process of being dropped. Avoid using it and update existing code if possible; see the compatibility table at the bottom of this page to guide your decision. Be aware that this feature may cease to work at any time.
>
> Mutation events provide a mechanism for a web page or an extension to get notified about changes made to the DOM. Use Mutation Observers instead if possible.

```html

Document

下述方法也可以监听使用《谷歌页面翻译》时的DOM变化

The following way also can catch changes of DOM when using Google page translation

使用MutationObserver(Using MutationObserver)

Hello Mr. Word!

添加(add DOM)

```

JS-监听整个页面上的DOM树变化的更多相关文章

  1. 监听整个页面上的DOM树变化

    在线预览 方法 使用<Web API 接口>的<MutationObserver> MutationObserver 网上查到的很多都是使用Mutation events的,但 ...

  2. js监听input等表单输入框的变化事件oninput

    js监听input等表单输入框的变化事件oninput,手机页面开发中使用到文本框textarea输入字符监听文本框变化计算还可以输入多少字符,如果使用onkeyup的话是无法监听到输入法输入的文本变 ...

  3. 原生Js监听普通dom尺寸变化

    原生Js监听普通dom尺寸变化 具体做法有以下几种: 初始化项目后,轮询,反复查看 dom 尺寸是否变化,这种一听就感觉不好,开销太大. 监听元素的滚动事件,在 目标 dom 里面包裹一个同等大小的 ...

  4. 【转】keyCode对照表及JS监听组合按键

    原文: http://blog.csdn.net/qq_21386275/article/details/67640576 有一些需求,html 页面上的input 框只允许输入数字,  只允许输入小 ...

  5. js 监听整个页面的回车事件

    JS监听整个页面的回车事件 <script type="text/javascript"> document.onkeydown=keyDownSearch;      ...

  6. 原 JS监听回车事件

    原 JS监听回车事件 发表于2年前(2014-06-04 10:16)   阅读(6101) | 评论(0) 11人收藏此文章, 我要收藏 赞0 1月16日厦门 OSC 源创会火热报名中,奖品多多哦  ...

  7. js监听输入框值的即时变化onpropertychange、oninput

    js监听输入框值的即时变化onpropertychange.oninput 很多情况下我们都会即时监听输入框值的变化,以便作出即时动作去引导浏览者增强网站的用户体验感. // //   要达到的效果 ...

  8. js监听用户的键盘敲击事件,兼容各大主流浏览器

    js监听用户的键盘敲击事件,兼容各大主流浏览器 <script type="text/javascript"> document.onkeydown = functio ...

  9. JS监听组合按键

    有些时候,我们需要在网页上,增加一些快捷按键,方便用户使用一些常用的操作,比如:保存,撤销,复制.粘贴等等. 下面简单梳理一下思路: 我们所熟悉的按键有这么集中类型: 单独的按键操作,如:delete ...

随机推荐

  1. slideshare原本是一个专业的幻灯片存储与展示的网站

    slideshare就是其中一个.slideshare原本是一个专业的幻灯片存储与展示的网站,它支持扩展名为ppt.pps和odp三种格式的幻灯片,用户上传成功以后slideshare会提供给用户一个 ...

  2. MySQL清除表数据而保留表结构TRUNCATE TABLE

    有时候我们会需要清除一个表格中的所有资料.要达到者个目的,一种方式是使用 DROP TABLE 指令,不过这样整个表格就消失,表无法再被用了.另一种方式就是运用 TRUNCATE TABLE 的指令. ...

  3. 启动线程,start和run的区别

    每个线程都有要执行的任务.线程的任务处理逻辑可以在Tread类的run实例方法中直接实现或通过该方法进行调用,因此 run()相当于线程的任务处理逻辑的入口方法,它由Java虚拟机在运行相应线程时直接 ...

  4. Java并发Condition接口

    java.util.concurrent.locks.Condition接口提供一个线程挂起执行的能力,直到给定的条件为真. Condition对象必须绑定到Lock,并使用newCondition( ...

  5. 什么是php递归

    程序调用自身的编程技巧称为递归( recursion).递归做为一种算法在程序设计语言中广泛应用. 一个过程或函数在其定义或说明中有直接或间接调用自身的一种方法,它通常把一个大型复杂的问题层层转化为一 ...

  6. addr2line探秘 [從ip讀出程式中哪行出錯]

    addr2line探秘 在Linux下写C/C++程序的程序员,时常与Core Dump相见.在内存越界访问,收到不能处理的信号,除零等错误出现时,我们精心或不精心写就的程序就直接一命呜呼了,Core ...

  7. 博弈的dfs

    题目: 链接:https://ac.nowcoder.com/acm/contest/283/D来源:牛客网 小西买了一堆肥宅快乐水和肥宅快乐茶,准备和室友比谁更肥宅. 快乐水有A瓶,快乐茶B瓶. 小 ...

  8. html input标签 要求只能输入纯数字

    在input标签添加以下代码即可 oninput = "value=value.replace(/[^\d]/g,'')" <input type="text&qu ...

  9. JS设置首字母大写算法

    返回一个字符串,确保字符串的每个单词首字母都大写,其余部分小写. 像'the'和'of'这样的连接符同理. function titleCase(str) { //把字符串所有的字母变为小写,并根据空 ...

  10. 2018-8-29-win2d-渐变颜色

    title author date CreateTime categories win2d 渐变颜色 lindexi 2018-08-29 08:58:14 +0800 2018-7-7 20:5:3 ...