jQuery:获取超出给定"y"位置的元素

Question

你怎么能用优雅的方式用jQuery做到这一点？

将z属性(例如:红色背景)应用于div的每个子节点,parent
同时它们的位置高于给定的顶部偏移量y.

我尝试过不同的方式,但我对他们中的任何一个都不满意......
我知道必须有一个简短而优雅的方式来做到这一点......

Answer 1

既然你说你已经尝试过几种方法,而你只是想找一些更优雅的东西,我会假设你已经找到了偏移部分,我会offset自己去做.根据需要修改该部分.为了优雅,您可以创建一个自定义选择器来检查顶部偏移:

$.expr[':'].above = function(obj, index, meta, stack) { 
    return $(obj).offset().top < meta[3];
}

然后你可以这样查询它:

$('#myParentDiv').find('div:above(100)').css('background-color', 'red');

当然,这也可以表达为

$('#myParentDiv div:above(100)').css('background-color', 'red');

或者,正如评论中所指出的那样

var y = 100;
$('#myParentDiv div:above('+y+')').css('background-color', 'red');

Answer 2

这样的事情应该可以完成工作：

var y = 250,
    RED = '#F00';

$('#parent > *').css('background-color', function (i, v)
{
    if ($(this).offset().top < y)
    {
        return RED;
    }
    return v;
});

选择器'#parent > *'将选择 id 元素的所有直接子元素（不是所有后代）parent。我认为这就是你要找的东西，因为你说“适用......对 div 的每个孩子parent”。

演示：http : //jsfiddle.net/mattball/87QFU/1/