contains()是dom原生方法，用于快速判断一个节点是否为另一节点的后代（含自身），须在祖先节点上调用且两节点同属一文档；未挂载、跨iframe、shadow dom或非元素节点均返回false。
contains() 是 DOM 原生方法，专用于快速判断一个节点是否为另一个节点的后代（含自身），不查结构、不比字符串、不遍历父链——只要两个节点同属一个文档，调用一次就出结果。
调用必须符合主谓逻辑
只能在**祖先节点上调用**，传入待检测的子节点：
- ✅ 正确：
container.contains(clickTarget) - ❌ 错误：
clickTarget.contains(container)（子节点永远不“包含”父节点） - ✅ 自身也算包含：
el.contains(el)返回true
确保节点已挂载且同文档
contains 只认真实存在于当前文档树中的元素节点（Node.ELEMENT_NODE）：
- 刚
document.createElement()创建但未append的元素，contains返回false - iframe 内创建的元素、Shadow DOM 中的节点，无法被外部容器的
contains检测到 - 文本节点、注释节点、
document对象本身传入会静默返回false，不报错但结果无效
典型高频场景与写法
它最常用于“点击外部关闭”类交互，逻辑干净无歧义：
- 弹窗关闭：监听
document点击，!popup.contains(e.target)时隐藏 - 下拉菜单收起：点击目标既不在菜单内，也不在触发按钮上，才执行收起
- 拖拽范围限制：
dropZone.contains(e.target)判断是否允许释放 - 表单区域失焦保护：聚焦离开整个表单区域时，才清空临时状态
别把它当 class 或文本检测工具
contains 只处理节点对象关系，和内容无关：
- ❌
div.contains('submit-btn')—— 字符串不是节点 - ❌
div.contains('Save')—— 不查文本内容 - ✅ 查 class：用
el.classList.contains('submit-btn') - ✅ 查文本：用
el.textContent.includes('Save')
