js动态监听dom变化
原生js 动态监听dom变化,根据不同的类型绑定不同的处理逻辑
// Firefox和Chrome早期版本中带有前缀
var MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver
// 选择目标节点
var target = document.querySelector('#some-id');
// 创建观察者对象
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
console.log(mutation.type);
});
});
// 配置观察选项:
var config = { attributes: true, childList: true, characterData: true }
// 传入目标节点和观察选项
observer.observe(target, config);
// 随后,你还可以停止观察
observer.disconnect();
浏览器支持情况:

著作权归作者所有。
商业转载请联系作者获得授权,非商业转载请注明出处。
原文: https://lcddjm.com/article/5a9fac195809d15ba1019710 © www.lcddjm.com
js动态监听dom变化的更多相关文章
- js实时监听dom尺寸变化
开发过程中总会遇到dom节点尺寸变化,去做一些相应的逻辑,第一想到的应该是用$(window).resize()去做,但是这个是监听浏览器窗口的所以这个时候要用 ResizeObserver Resi ...
- 对于单页应用中如何监听 URL 变化的思考
周末开发了一个在 GitHub 中给 repo 增加自定义备注的 chrome 扩展. 开发这个扩展的原因是我在 GitHub 中所 star 的项目实在太多了(截止目前 671 个),有的项目过个几 ...
- JS监听DOM结构变化
在做一个微博的接入,需要判断微博是否被关注,要检查微博标签的DIV是否有“已关注”的字符,但这个DIV的内容是微博JSSDK动态生成.$("#id").html()是获取不到我想要 ...
- vue.js之过滤器,自定义指令,自定义键盘信息以及监听数据变化
一.监听数据变化 1.监听数据变化有两种,深度和浅度,形式如下: vm.$watch(name,fnCb); //浅度 vm.$watch(name,fnCb,{deep:true}); //深度监视 ...
- 监听窗口大小变化,改变画面大小-[Three.js]-[onResize]
如果没有监听窗口变化,将会出现一下情况: 请求,在系统表`information_schema`.`INNODB_TR ...
- pandas第一课
pandas第一课 首先是数据的准备 movies.dat user.dat ratings.dat 注意,这些数据都是通过::来隔开每一列的,每一列有各自的含义 现在通过pandas来读入数据 首先 ...
- 简单的AOP标签
常用标签 1.1<aop:config> //作用 用于声明aop的配置 //配置:<aop:config></aop:config> 1.2 <aop:as ...
- Azure CosmosDB (5) 高可用性
<Windows Azure Platform 系列文章目录> Azure Cosmos DB 透明地复制与您的Cosmos帐户关联的所有Azure区域中的数据. Cosmos DB 对数 ...
- c++ map 注意事项
1. 往map里面插入元素: 下标方式[]: map[key] = value; 调用insert: map.insert(make_pair(key, value)); 下标方式 ...
- Web高级 Eventloop和事件执行顺序
1. EventLoop 1.1 调用栈 当一个方法执行时内部调用另外的方法,则会形成调用栈,如图: 1.2 任务队列 JavaScript有一个主线程执行当前任务,主线程的代码同步执行,并把遇到的事 ...
- mysql常规巡检
mysql常规巡检 目录 一.巡检脚本 二.下载巡检脚本 三.脚本执行说明 1.inspection.conf 使用说明 2.inspection_mysql.sh 使用说明 3.mysqltun ...
- MySQL单机单实例安装脚本(转载)
说明:使用mysql generic tar.gz包快速安装mysql 三个文件installation_of_single_mysql.sh.template_install-my.cnf.mysq ...
- Windows下访问控制管理
参考URL: https://blog.csdn.net/u011801161/article/details/45567289 http://blog.nsfocus.net/analysis-wi ...