如果是要起到截图水印的效果，那就要防止用户使用开发者工具之类的删除或者修改节点的样式去除水印，这时候可以用到 MutationObserver 构造函数，他可以创建并返回一个新的 MutationObserver 它会在指定的dom发生变化时被调用

// 禁止修改水印节点
let targetNode = document.querySelector('#__water-mark')
let config = {
	childList: true,
	attributes: true,
	characterData: true,
	subtree: true,
	attributeOldValue: true,
	characterDataOldValue: true
}

const mutationCallback = mutationList => {
  for (let mutation of mutationList) {
    let type = mutation.type
    switch (type) {
      case 'childList':
        console.log('节点被删除或添加')
        break
	  case 'attributes':
		console.log(`${mutation.attributeName}属性修改了`)
        break
      case 'subtree':
        console.log('子树被修改')
		break
	  default:
		break
    }
  }
}

// 创建 MutationObserver 实例
let observer = new MutationObserver(mutationCallback)

// 开始监控目标节点
observer.observe(document.body, config)

// 停止监控
// observer.disconnect()

在检测到修改的时候，可以对比被修改的元素的ID，如果是水印的ID，这时候可以删除水印div后重新执行第一步的插入操作，以达到避免水印被修改的目的