如何用jQuery选择孩子和自我？

Question

我想知道在jQuery中找到元素的子元素的最佳方法是什么，但也包括“查找”中的父元素。

这是我简化的基本HTML设置：

<div id="container">
    <form id="form1"> <!-- form 1 content --> </form>
    <form id="form2"> <!-- form 2 content --> </form>
</div>

我想要一个像这样的功能......

function getForms ($container) 
{
    // Option 1
    var $allForms = $container.find('form').andSelf().filter('form');

    // Option 2
    var $allForms = $container.find('form');
    if ($container.is('form')) $allForms.add($container);

    // Should return all the forms in the container if passed $('#container')
    // Or return just one form if passed $('#form1')
    return $allForms;
}

我很确定选项1或2都可以使用。有谁知道上面哪个选项更有效？还有其他更优雅或更高效的选择吗？

修改 我对选项2中的 .is（）感到不满意，因为当容器中有多个jQuery对象时它不起作用。所以我想出了类似的东西：

// Option 3
function getContainerElements ($container, selector) {
    return $container.find(selector).add($container.filter(selector));
}

我没有对它进行太多测试，但我认为它适用于所有一般情况。

Answer 1

根据JSPerf测试（在Linux上测试Chrome）

，选项2更好

如果您想在不同的浏览器中尝试，可以在此处查看结果和测试： http://jsperf.com/children-and-self

注意：我已更新此测试以使用div而不是表单（因为其他表单中的表单不起作用：Form inside a form, is that alright?）并且我们想要测试应添加父级以获取根据以下评论的实际绩效影响

修改

根据评论

中的要求添加了第三个选项效果