该接口用来观察节点变化,MutationObserver是一个构造器,接收一个回调函数callback用来处理节点变化时所做的操作。 var observe = new MutationObserver(mutationCallback) var observe = new MutationObserver(mutationCallback) observe.observe(dom, config)// 后面介绍config的配置 var observe = new MutationObserver(mutationCallback) observe.disconnect() var observe = new MutationObserver(mutationCallback) var record = observe.takeRecords() let config = { attributes: true, //目标节点的属性变化 childList: true, //目标节点的子节点的新增和删除 characterData: true, //如果目标节点为characterData节点(一种抽象接口,具体可以为文本节点,注释节点,以及处理指令节点)时,也要观察该节点的文本内容是否发生变化 subtree: true, //目标节点所有后代节点的attributes、childList、characterData变化 } <div id="h">123123</div> <script> window.onload=function(){ // Firefox和Chrome早期版本中带有前缀 var MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver // 选择目标节点 var target = document.querySelector('#h') // 创建观察者对象 var observer = new MutationObserver(function(mutations) { mutations.forEach(function(mutation) { console.log(mutation) }) }) // 配置观察选项: var config = { attributes: true, childList: true, characterData: true } // 传入目标节点和观察选项 observer.observe(target, config) // 随后,你还可以停止观察 // observer.disconnect() document.getElementById('h').onclick=function(){ // this.style.width="50px" this.innerHTML = "888888" } } </script> 原文链接:https://blog.csdn.net/weixin_42420703/article/details/98334813
js 怎么监听到页面关闭或页面跳转事件,以下介绍方法:
//在页面关闭或者跳转的时候调用
window.onbeforeunload = function (e) {
return e.returnValue = '确认关闭?'
}
window.onunload = function () {
//这个执行完onbeforeunload 会调用该function,
//alert()是不会有弹出的。
}
调用上面的代码,用谷歌浏览器关闭浏览页面或者跳转页面都会弹出下面页面询问。
注意:刷新的时候也会弹出询问,这监控也把刷新当成重新打开页面相当跳转。
js 监听到页面关闭或页面跳转事件。
javascript捕获窗口关闭事件有两种方法 onbeforeunload(),onUnload() 用法有两种:
1. function
window.onbeforeunload() { alert("远标培训为您关闭窗口")} function
window.onunload() { alert("远标培训为您关闭窗口")}
2.Onunload,onbeforeunload都是在刷新或关闭时调用,可以在<script>脚本中通过window.onunload来指定或者在<body>里指定。
区别在于onbeforeunload在onunload之前执行,它还可以阻止onunload的执行。