如何用jQuery的children()方法过滤<br>标签？返回值类型疑问

1. keys 是jQuery对象还是普通列表？ #

const keys = $("#numbers").children(); 得到的keys是jQuery对象，它是类数组结构，包含匹配的所有子DOM元素，同时自带jQuery的各类方法（比如is()、filter()、remove()等），不是普通的JavaScript数组。你可以通过keys.length获取元素数量，也能用keys[i]取出单个原生DOM节点，但要调用jQuery方法的话，得用$(keys[i])把它包装成jQuery对象。

2. 用children()处理，移除/过滤<br>元素的正确方式 #

方式一：获取子元素时直接过滤 #

如果只想拿到不含<br>的按钮集合，可以直接在children()里加选择器筛选：

$(() => {
  const keys = $("#numbers").children(":not(br)");
  // 此时keys里仅包含<button>元素
  keys.each(function() {
    console.log($(this)); // 输出每个按钮的jQuery对象
  });
});

方式二：先获取所有子元素，再过滤 #

如果已经拿到包含<br>的keys对象，后续可以用filter()方法筛掉<br>：

$(() => {
  let keys = $("#numbers").children();
  // 过滤掉br元素，得到仅含按钮的jQuery对象
  keys = keys.filter(":not(br)");
  
  // 要是想从DOM里直接删除br元素，用这个：
  // keys.filter("br").remove();
});

你的原代码问题 #

你原代码里的if (keys.is("br"))逻辑错误——keys是整个jQuery集合，is("br")判断的是整个集合里有没有匹配br的元素，不是判断当前循环的单个元素。正确写法应该针对循环中的单个元素判断：

$(() => {
  const keys = $("#numbers").children();
  for (var i = 0; i < keys.length; i++) {
    const currentElement = $(keys[i]);
    console.log(currentElement);
    if (currentElement.is("br")) {
      console.log("Br FOUND");
    }
  }
});

补充：为什么find()能解决问题？ #

find()会查找所有后代元素（包括子元素的子元素），而children()只取直接子元素。你的场景里<br>是#numbers的直接子元素，children()完全能处理，只是之前的过滤逻辑写错了而已。

内容的提问来源于stack exchange，提问作者Marawan