jquery - jQuery 的多重选择器 + find() vs children()

Question

<select id="select1">
    <option value="11">11</option>
    <option value="12">12</option>
</select>

<select id="select2">
    <option value="21">21</option>
    <option value="22">22</option>
</select>​

的行为find()和children()方法：

find()：

$('#select1, #select2').find('option:not(:first)').remove();​​​​​​

按预期工作：select1只有选项11并且select2只有选项21

children()：

$('#select1, #select2').children('option:not(:first)').remove();

奇怪的工作：select1只有选择11，但select2没有选择了......

为什么？

演示

Answer 1

我无法解释为什么.find使用:first，但.children无法使用，:first因为:first获取选定元素集中的第一个选定元素，而不是第一个子元素。你想要的是:first-child.

// children
$('#select1, #select2').children('option:not(:first-child)').remove();

// find
$('#select3, #select4').find('option:not(:first-child)').remove();​

演示：http: //jsfiddle.net/tyZzy/2/

这可能是一个错误，尽管它需要更多的研究。

Answer 2

从我看到的

$('#select1, #select2').find('option:not(:first)')

等于

$('#select1  option:not(:first), #select2  option:not(:first)')

不是

$('#select1, #select2').children('option:not(:first)')

考虑上下文选择器，因为它与使用 .find() 相同

$('option:not(:first)',$('#select1, #select2'))

通过将 children 与 first.. 一起使用，您只会在 collection.. 中返回第一个 children 选项，而 context/find 选择器在每个上下文中查找第一个