contains是DOM节点方法，用于判断父节点是否包含指定子节点（含自身），返回布尔值；需确保参数为有效节点对象，兼容IE9+，常用于事件委托如点击外部关闭下拉菜单。
contains 是 DOM 节点对象上的原生方法，用于判断当前节点是否**包含**（即在它的子树中）另一个指定节点。它返回布尔值：true 表示包含，false 表示不包含（包括自身相等时也返回 true）。
基本用法和注意事项
调用形式为：parent.contains(child)。注意：
- 必须是 DOM 节点对象，不能是字符串、选择器或
null -
child可以是任意节点（元素、文本、注释等），只要在parent的后代节点树中（含自身）就返回true - 如果
child === parent，结果也是true - 若
child为null或非节点类型，现代浏览器会静默转为false（但规范建议先校验）
常见使用场景示例
比如判断点击目标是否在某个下拉菜单内部，从而决定是否关闭菜单：
document.addEventListener('click', (e) => {
const dropdown = document.getElementById('myDropdown');
const target = e.target;
if (!dropdown.contains(target)) {
// 点击发生在下拉菜单外部，收起菜单
dropdown.classList.remove('show');
}
});
兼容性与安全写法
contains 在所有现代浏览器及 IE9+ 中都支持。为防意外（如传入非节点），可加一层保护：
function isDescendant(parent, child) {
return parent && child && parent.nodeType === 1 && child.nodeType === 1
? parent.contains(child)
: false;
}
或者更简洁地利用逻辑短路：
if (dropdown && dropdown.contains && dropdown.contains(target)) { ... }
容易混淆的点
别把它和 Node.compareDocumentPosition() 或 jQuery 的 .has() 混淆：
-
contains只回答“是否在子树中”，不提供位置关系细节 -
parent.hasChildNodes()判断是否有子节点，不是判断是否包含某具体节点 -
Element.closest(selector)是反向查找祖先，用途不同
