0

クラス名 tmpSelectedおよびselected$cを持つ要素を含む複数の要素を持つ含まれているjQuery オブジェクトを考えると、各クラス名、できればtmpSelectedから 1 つの要素のみを選択したいと思います。マークアップは、これの複雑なバージョンです。$c

<ul id="a">
    <li class="selected"><a href="foo">Foo</a></li>
    <li><a href="bar">Bar</a></li>
    <li><a href="baz">Baz</a></li>
    <li><a href="biz">Biz</a></li>
</ul>
<ul id="b">
    <li><a href="woo">Woo</a></li>
    <li><a href="war">War</a></li>
    <li class="tmpSelected"><a href="waz">Waz</a></li>
    <li><a href="wiz">Wiz</a></li>
</ul>
<ul id="c">
    <li class="selected"><a href="xuu">Xuu</a></li>
    <li class="tmpSelected"><a href="xur">Xur</a></li>
    <li><a href="xuz">Xuz</a></li>
    <li><a href="xyz">Xyz</a></li>
</ul>

この場合、私が最終的に望むのは、要素が の兄弟を持っている場合はその要素$("#a > .selected, #b > .tmpSelected, #c > .tmpSelected")を避け、whereの各メンバーに対して複数の子要素を選択したくないということです。.selected.tmpSelected$c$c = $("#a, #b, #c")

だからこれは私が思いついたものです：

var $c = $("#a, #b, #c");
var $selected = $c.map(function (idx, el) {
    var $el = $(el);
    var $tmpSel = $el.children(".tmpSelected");
    return $tmpSel.length ? $tmpSel : $el.children(".selected");
});

明示的なループなしでこれを行う合理的な方法はありますか? .tmpSelected(PS -または.selected子が存在しない場合、空のセレクターを返すことは問題ありません。)

4

2 に答える 2

2

これは、親ごとに単一のアイテムのみを返すことを保証することを除いて、既に持っていたものと概念がかなり似ていることをお勧めします。

var selected = $("#a, #b, #c").map(function() {
   var item = $(this).find(".tmpSelected");
   if (!item.length) {
       item = $(this).find(".selected");
   }
   return(item.get(0));
});
于 2012-08-22T23:17:40.207 に答える
2

ここにセレクターがありますが、かなり面倒です。私はそれが正しい解決策を提供すると信じています：

$("ul > li.tmpSelected, ul:not(:has(li.tmpSelected)) > li.selected");

.tmpSelectedまず、 and要素を探します。次に、要素ulのみを持つものを探します。セレクターは子を探し、セレクターを使用して.selected要素を見つけます。次に、単に子要素を取得します。:has:notulselected

jsフィドル

于 2012-08-22T23:19:12.830 に答える