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]
如果没有监听窗口变化,将会出现一下情况:  print substr($1 ...
- web.py模块使用
web.py模块 import time import web urls=("/",'hello') class hello(): def GET(self): return (t ...
- fatal error: No such file or directory
在fase_ws中编译ground_car包,遇如下报错: /home/gordon/fase_ws/src/fsae/ground_car/plugins/gazebo_ros_block_lase ...
- WAMP中mysql服务突然无法启动 解决方法
wamp的mysql服务前两天还能用,今天突然不能无法启动了,原因可能是近期电脑强行关机,删除wamp\bin\mysql\mysql5.6.17\data目录下的ib_logfile0和ib_log ...
- git中加入中文时,乱码
原因:编码问题,可以看到txt转为为ANSI编码 ---->将编码方式改为UTF-8即可
- Ubuntu 16.04将左侧面板置于底部
ctrl+alt+t打开终端,输入: gsettings set com.canonical.Unity.Launcher launcher-position Bottom 有Bottom和Left两 ...
- innodb使用大字段text,blob的一些优化建议(转)
原文 https://yq.aliyun.com/articles/9072 最近看到一些老应用,在表结构的设计上使用了text或者blob的字段:其中一个应用,对blob字段的依赖非常的严重,查询和 ...
- (转)通过注册表修改VC6.0的字体
出处:http://www.cnblogs.com/PocketZ 在VC6.0下更改字体,我们一般通过菜单-Tools-Options-Format来更改 但在我的win7 64位系统下这一选项下的 ...
- Java核心-多线程-并发控制器-Exchanger交换器
1.基本概念 Exchanger,从名字上理解就是交换.Exchanger用于在两个线程之间进行数据交换,注意也只能在两个线程之间进行数据交换. 线程会阻塞在Exchanger的exchange方法上 ...