利用MutationObserver对页面元素的改变进行监听
'use strict';
let MutationObserver = window.MutationObserver
|| window.WebKitMutationObserver
|| window.MozMutationObserver;
let observerMutationSupport = !!MutationObserver;
if(observerMutationSupport){
let observer = new MutationObserver((mutations) => {
mutations.forEach((item) => {
console.log(item);
});
});
const options = {
"childList" : true,//子节点的变动
"attributes" : true,//属性的变动
"characterData" : true,//节点内容或节点文本的变动
"subtree" : true,//所有后代节点的变动
"attributeOldValue" : true,//表示观察attributes变动时,是否需要记录变动前的属性
"characterDataOldValue" : true//表示观察characterData变动时,是否需要记录变动前的值
};
observer.observe(document,options);
}
利用MutationObserver对页面元素的改变进行监听的更多相关文章
- 利用 jQuery 操作页面元素的方法,实现电商网站购物车页面商品数量的增加和减少操作,要求单项价格和总价随着数量的改变而改变
查看本章节 查看作业目录 需求说明: 利用 jQuery 操作页面元素的方法,实现电商网站购物车页面商品数量的增加和减少操作,要求单项价格和总价随着数量的改变而改变 当用户单击"+" ...
- 利用 chunked 类型响应实现后台请求的监听
Koa 中实现 chunked 数据传输 中介绍了如何在 Koa 中实现 Transfer-Encoding:chunked 类型的响应分片传输.这里来看一个应用场景. 假如我们想监听后台的请求,并将 ...
- 百度编辑器的内容改变事件监听bug
先贴上我的初始化代码,可能是用法问题冤枉了百度编辑器,如果是我的用法有问题欢迎大侠们指正 <!DOCTYPE type> <html> <head> <met ...
- JS常用方法(获取Class、获取元素样式、事件监听、cookie、ajax等)
var Util = {}; Util.byClass = function (oClass) {//全局获取 var tags = document.all ? document.all : doc ...
- AngularJS中的route可以控制页面元素的改变,使多页面变成一个单页面。。。
SPA(Single Page Application)指的是通单一页面展示所有功能,通过Ajax动态获取数据然后进行实时渲染,结合CSS3动画模仿原生App交互,然后再进行打包(使用工具把Web应用 ...
- 页面返回刷新或H5监听(手机的)返回键
1. pushHistory(); window.addEventListener("popstate", function(e) { alert("我监听到了浏览器的返 ...
- 利用Python的pyHook包来进行键盘监听
最近在实习的时候发现一件很蛋疼的事情,那就是我们组的项目因为有后台进程,所有每次运行完以后后台进程都必须要自己手动关闭,每次编译之前忘记关就会有一大堆编译错误,我就想直接弄个可以快捷键直接关闭算了 ...
- js 元素添加多个监听
function addListener(element,e,fn){ if(element.addEventListener){ element.addEventListen ...
- Python+Selenium自动化-定位页面元素的八种方法
Python+Selenium自动化-定位页面元素的八种方法 本篇文字主要学习selenium定位页面元素的集中方法,以百度首页为例子. 0.元素定位方法主要有: id定位:find_elemen ...
随机推荐
- 在iOS中创建静态库
如果您有不错的原创或译文,欢迎提交给我们,更欢迎其他朋友加入我们的翻译小组(联系qq:2408167315). =========================================== ...
- Jetty实战之 安装 运行 部署
本文地址:http://blog.csdn.net/kongxx/article/details/7218767 1. 首先从Jetty的官方网站http://wiki.eclipse.org/Jet ...
- Internship
zoj2532:http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemId=1532 题意:有n个发射点,m个中继站,然后发射点会发射一些信息 ...
- 用PYTHON输入输出字符串
这段好懂的,可以互动. import sys import re class BadEmployeeFormat(Exception): """Badly formatt ...
- Junit4学习笔记--方法的执行顺序
package com.lt.Demo.TestDemo; import java.util.Arrays; import java.util.Collection; import org.junit ...
- Keil C51软件的使用
进入 Keil C51 后,屏幕如下图所示.几秒钟后出现编辑界 启动Keil C51时的屏幕 进入Keil C51后的编辑界面 简单程序的调试:学习程序设计语言.学习某种程序软件,最好的方法是直接操作 ...
- 关于IOS开发者账号一点总结
经过查阅相关资料,我扼要总结了以下几点内容. 一.开发者账号类型 个人账号 99美金/年 公司账号 99 企业账号 299 教育账号 0 二.开发者账号有无比较 如果有: 可以真机测试 发布的应用可以 ...
- PHP SSL Module "subjectAltNames"空字节处理安全绕过漏洞
漏洞版本: PHP 5.3.27 PHP 5.4.17 PHP 5.5.1 漏洞描述: Bugtraq ID:61776 PHP是一种HTML内嵌式的脚本语言 PHP SSL模块不正确处理服务器SSL ...
- 队爷的Au Plan CH Round #59 - OrzCC杯NOIP模拟赛day1
题目:http://ch.ezoj.tk/contest/CH%20Round%20%2359%20-%20OrzCC杯NOIP模拟赛day1/队爷的Au%20Plan 题解:看了题之后觉得肯定是DP ...
- lambda -- Filter Java Stream to 1 and only 1 element
up vote10down votefavorite I am trying to use Java 8 Streams to find elements in a LinkedList. I wan ...