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]
如果没有监听窗口变化,将会出现一下情况: )
# 函数原型detectMultiScale(gray, 1.2,3,CV_HAAR_SCALE_IMAGE,Size(30, 30)) # gray需要识别的图片 # 1.03:表示每次图像尺寸减小 ...
- Spring MVC的原理及配置详解
网址链接:https://www.cnblogs.com/baiduligang/p/4247164.html
- How to detect, enable and disable SMBv1, SMBv2, and SMBv3 in Windows and Windows Server
转自:https://support.microsoft.com/en-us/help/2696547/detect-enable-disable-smbv1-smbv2-smbv3-in-windo ...
- KiCad 一款强大的 BOM 和 装配图生成插件
KiCad 一款强大的 BOM 和 装配图生成插件 可以生成 BOM 和在线的图形. https://github.com/openscopeproject/InteractiveHtmlBom In ...
- 【java】多态
多态:某一类事物的多种存在形态 如:动物中的猫和狗猫对象对象的类型是猫类型,即 cat c1= new cat()但同时猫也是动物中的一种,也可以把猫成为动物,即 animal c1= new cat ...
- elasticsearch -- kibana安装配置
Kibana 是为Elasticsearch设计的开源分析和可视化平台,你可以使用 Kibana 来搜索,查看存储在 Elasticsearch 索引中的数据并与之交互.你可以很容易实现高级的数据分析 ...
- 如何一步一步新建一个Owin项目
打开VS2015,新建Web应用程序,命名为OwinWeb(名字随意). 在弹出的“新建ASP.NET项目”窗口中选择“Empty”模板,“为以下项添加文件夹和核心引用”处全不选.点击确定. 创建完后 ...
- SVN迁移到GitLab,保留提交记录
1.下载GitBash 此工具自带git svn命令,无需再下载git-svn工具 2.GitBash终端中输入以下命令 git svn clone svnurl srcPath 3.push本地仓库 ...
- 一本通之 一堆迷宫 (Dungeon Master&走出迷宫&走迷宫)
一本通在线崩溃....... . 有图有真相 这是个三维迷宫,其实和二位迷宫差不多,只是方向多加了2个. 但这个题的输入十分恶心,一度被坑的用cin.ignore(),但还是不过... 它的正确输入方 ...
- 廖雪峰Java9正则表达式-2正则表达式进阶-3分组匹配
1.使用括号可以提取字符串 不加括号匹配电话号码 匹配成功后,如何提取想要的字符串? 使用(...)可以分组:"^(\d{3,4})\-(\d{6,8})$" 2.String.m ...