利用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 ...
随机推荐
- 修炼debug
常用方法: alert console.log 行号手工打breakpoints 手工加入debugger:配合条件if(){debugger;} break on dom modify eventL ...
- 【UVA1416】(LA4080) Warfare And Logistics (单源最短路)
题目: Sample Input4 6 10001 3 21 4 42 1 32 3 33 4 14 2 2Sample Output28 38 题意: 给出n个节点m条无向边的图,每条边权都为正.令 ...
- SysErrorMessage 函数和系统错误信息表
在看 API 文档时, 我们经常见到 GetLastError; 它可以返回操作后系统给的提示.但 GetLastError 返回的只是一个信息代码, 如何返回对应的具体信息呢?FormatMessa ...
- LINUX6.3下RHCS的安装文档
LINUX6.3下RHCS的安装及集群的配置文档 环境: 目前要给华为E6000系列的两个刀片安装RHCS,每一块刀片有两个业务网口和一个管理网口,但是看不见不物理网卡,而是连接到刀片自身携带的一个交 ...
- jquery.lazyload的使用
1.引入 <script src="jquery.js" type="text/javascript"></script> <sc ...
- 数据结构(分块):[HZOI 2015]easy seq
[题目描述] 给定一个序列,下标从0开始,分别为a0,a1,a2...an−1,有m个询问,每次给出l和r,求满足ai=aj且l<=i<=j<=r时j−i的最大值 本题强制在线,l和 ...
- Linux cat命令详解
本文主要内容源自网络,参考资料如下: 华夏名网,linux cat命令详解,http://www.sudu.cn/info/html/edu/20070101/290711.html 命令格式:cat ...
- .net开源工作流引擎ccflow
关于济南驰骋信息技术有限公司的.net开源工作流引擎 驰骋工作流引擎,工作流程管理系统:简称ccflow,驰骋一体化解决方案简称ccport. ccflow是济南驰骋信息技术有限公司向社会提供的一款1 ...
- HTML---网页编程(1)
前 言 HTML需要和CSS还有JS一起用,才能提现强大. 所以,学了HTML.最好去学学CSS还有JS(JavaScript) ☆静态页面和动态页面 网站页面分为静态页面和动态页面两种 • 静态页面 ...
- 4种字符串匹配算法:KMP(下)
回顾:4种字符串匹配算法:BS朴素 Rabin-karp(上) 4种字符串匹配算法:有限自动机(中) 1.图解 KMP算法是一种改进的字符串匹配算法,由D.E.Knuth,J.H.Morris和V.R ...