样式监听

watchStyle () {
  const el_class_parent = document.querySelector('要监听的元素')
  const observer = new MutationObserver(callback)
  var that = this
  function callback (mutationRecords, observer) {
    mutationRecords.forEach(mutationRecord => {
      if (this.timer) {
        // 防抖一下,方便打印最后一次
        clearTimeout(this.timer)
      }
      this.timer = setTimeout(() => {
        // 可以在这里打印这个元素
      }, 50)
    })
  }
  const config = {
    attributes: true,
    attributeFilter: undefined, /*需要监听的属性名称列表,如果没有表示监听全部的属性*/
    attributeOldValue: true, /*传递之前旧的值给mutationRecord*/
    characterData: true, /*是否监听内部文本节点的数据变化*/
    characterDataOldValue: true, /*mutationRecord 是否包含内部文本节点变化前的数据*/
    childList: true,
    subtree: true /*是否把监听的方位放到节点树中的全部子节点上*/
  }
  observer.observe(el_class_parent, config)
},

  

posted @ 2022-12-20 16:44  小万子呀  阅读(20)  评论(0编辑  收藏  举报