只選擇兩個選擇器

Question

鑑於含jQuery對象$c一個其中有多個元件包含與選定類名tmpSelected和元件中的一個，我想選擇從$c只有一個元素爲每個類名，優選tmpSelected。標記是這樣一個複雜的版本：

<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") - 我想避免.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"); 
}); 

是否有一個合理的辦法做到這一點沒有明確的循環？ （PS - 當沒有.tmpSelected或.selected孩子存在時，可以返回一個空選擇器。）

Answer 1

這是一個選擇器，但它很雜亂。我相信它提供了正確的解決方案：

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

首先你尋找和.tmpSelected元素。然後你尋找只有.selected元素的任何ul。 :has選擇器查找孩子，我使用:not選擇器查找ul元素。然後，我只需抓住孩子selected元素。

jsFiddle

Answer 2

我會建議這在概念上與您已經擁有的非常相似，除了這保證它只返回單個項目每個家長。

var selected = $("#a, #b, #c").map(function() { 
    var item = $(this).find(".tmpSelected"); 
    if (!item.length) { 
     item = $(this).find(".selected"); 
    } 
    return(item.get(0)); 
});