Question

我的情况是我的所有选择器都具有相同的祖先元素

$('#foo .bar')...
$('#foo .some_class')...
$('#foo .some_other_class')...

我想知道是否有办法告诉jQuery总是假设选择器将从#foo下降？像

这样的东西

$.ancestorWillAlwaysBe('#foo');
$('.bar')...
$('.some_class')...
$('.some_other_class')...

Answer 1

$ancestor = $("#foo");
$$ = function(arg) {
    return $(arg, $ancestor);
}

$$('.bar').html("descendant of foo");

就我个人而言，我会使用类似$ancestor.find('.bar')之类的东西......出于代码清晰的原因。

Answer 2

您似乎懒得输入所有#foo。以下是一种更简单的方法：

var e = $("#foo");  //short enough
$('.bar', e);
$('.some_class', e);
$('.some_other_class', e);

或者，如果真的那么懒惰，你可以这样做：

$ = function(que, anc){
    if($.ancestor){
        return jQuery(que, $.ancestor);
    }else{
        return jQuery(que, anc);
    }
}

$.ancestor = "#foo";  //Ancestor will now always be #foo
$('.bar')...
$('.some_class')...
$('.some_other_class')...
$.ancestor = undefined;  //Clear

DEMO： http://jsfiddle.net/DerekL/agnHy/

Answer 3

没有简单的方法可以完全按照你的要求去做，但你可以找到它：

var $foo = $('#foo');

然后：

var others = $foo.find('.bar');

请记住，在可能的情况下，最好在选择器的最右侧使用标签名称（尽管现在的浏览器中的选择器解释速度非常快，以至于优化通常不值得麻烦）。因此：

var others = $foo.find('span.bar');

当然有时这是不可取的，例如，如果你真的不能轻易缩小所涉及的元素类型。

edit - 给出缓存的jQuery结果的约定以“$”开头的名称就是：一个约定。这不是必要的，我同情那些发现它令人反感的人： - ）

Answer 4

我有点懒，可能只是创建一个函数：

function a(elem) {
    return $('#foo').find(elem);
}

并像这样使用它：

a('.bar').css('color', 'red');

FIDDLE

或者只是创建一个表达式来清除#foo里面的任何内容，因为这可能就是你所追求的，否则只是针对这个类就可以了。

$.extend($.expr[":"], {  
    foo: function(elem){  
         return $(elem).closest('#foo').length;  
    }  
});

并做：

$('.bar:foo').css('color', 'red');

FIDDLE

Answer 5

我认为你正在寻找

Child Selector (“parent > child”)

选择由“parent”

指定的元素的“child”指定的所有直接子元素

OR

:first-child Selector

选择所有父元素的第一个子元素。

jQuery为范围设置了祖先元素

5 个答案: