jQuery.contains(parent,child)返回错误结果，使用方式是否正确？

数据老陈

2026-5-13

问题分析与解决方法

你遇到的问题核心是用错了jQuery.contains()的参数类型，这才导致明明两个元素没有从属关系却返回true。

为什么会出现这个错误？

jQuery.contains(parent, child)这个方法的官方要求很明确：

第一个参数必须是原生DOM元素（也就是浏览器直接识别的Element对象）
第二个参数同样需要是原生DOM元素

但你代码里的parent = $("#parent")和child = $("#child")得到的是jQuery包装后的对象，不是原生DOM元素。当你把jQuery对象传入这个方法时，它内部的判断逻辑会出现误判，所以返回了不符合预期的true。

正确的使用方式

有两种常见的正确做法，选哪种都能解决你的问题：

1. 转换为原生DOM元素后调用`jQuery.contains()`

通过jQuery对象的.get(0)或者直接取下标的方式，获取到原生DOM元素再传入方法：

function clickme() {
  const parent = $("#parent");
  const child = $("#child");
  // 把jQuery对象转为原生DOM元素
  const result = jQuery.contains(parent.get(0), child.get(0));
  alert(result); // 现在会返回正确的false
}

2. 用jQuery自带的方法替代（更符合jQuery开发习惯）

如果你不想处理原生DOM元素，可以用jQuery的.closest()或者.is()方法来判断从属关系：

function clickme() {
  const parent = $("#parent");
  const child = $("#child");
  // 方法一：用closest判断child的祖先是否包含parent
  const result1 = child.closest(parent).length > 0;
  // 方法二：用is判断child是否是parent的后代元素
  const result2 = child.is(parent.find("*"));
  alert(result1); // 同样返回正确的false
}