Question

我现在拥有的：

var result = $('selector1');
if (result.length == 0) result = $('selector2');

但这会打败链条。

问题是 - 如何使用JQuery链接获得相同的结果？

我无法使用$('selector1, selector2')，因为这总是会为两个选择器选择结果集，而只有selector2没有匹配元素时才需要selector1的结果。< / p>

Answer 1

某些地方的这种行为称为“合并”。这是一个通用的jQuery插件，可以为您完成（在收到很好的反馈后进行编辑，请参阅注释）。

// The namespace function
jQuery.coalesce = function(selectors){

    var out;

    $.each(selectors, function(i, v){
        var el = jQuery(v);
        if (el.length) {
           out = el;
           return false;
        }
    });

    return out || jQuery();
};

// The jQuery plugin
jQuery.fn.coalesce = function(){
    return jQuery.coalesce(this.selector.split(",")); //a little brittle
};

所以，在#foo不存在，a和div这样做的世界中，如果你这样做：

jQuery.coalesce(["#foo", "a", "div"])

如果jQuery("a")不存在，则返回#foo;如果jQuery("#foo")确实存在，则返回#foo。

如果您需要在链中间使用它，可以使用$("#foo, a, div").coalesce()，但它很容易受到选择器内的commans的影响。

Answer 2

如果你必须，这样就可以了：

$(function(){
  var r = $('selector1');
  if (r.length == 0) r = $('selector2');
  return r;
}());

但是，我不认为链接在你的例子中被打败了。链接并不是最终所有，并且像上面那样进行折磨选择会使代码混淆而不是简化代码。

Answer 3

var result = $('selector1');
( result.length ? result : $('selector2') ).css('color', 'red');

Answer 4

我不相信你可以用纯粹的jQuery完全按照你想要的方式做到这一点，但是你可以通过使用jQuery的扩展选择器来获得你正在寻找的一些功能，它允许你根据否定选择布尔运算符。查看http://api.jquery.com/category/selectors/jquery-selector-extensions/。

Answer 5

就我个人而言，我非常喜欢 Ruby on Rails 中的“存在”习语，因此我将其添加到我的 JS 设置中：

jQuery.fn.presence = function presence() {
    return this.length !== 0 ? this : null;
};

现在在我的代码中使用它：

const ul = el.parents('UL').first().presence() ?? el.siblings('UL').first()

（如果您负担不起使用 ??，|| 在这里也可以。）

如何使用OR条件链接选择器（如果main为空，则替代结果集）

5 个答案: