Question

假设，这个html ......

<div id="main">
  <div><!--should select this-->
    <article>should not select this</article>
  </div>
  <div><!--should not select this-->
    <article>should select this</article>
    <article>should select this</article>
  </div>
</div>

重新声明我的问题：如果文章只有一篇，我想选择文章的一级父级，如果文章不止一种，则不应选择一级父级，而应选择文章本身。

我需要更清晰的方法来选择它作为选择器。

Answer 1

尝试

var $els = $('#main').find('> div, > div > article').filter(function () {
    return this.tagName == 'DIV' ? $(this).children().length == 1 : $(this).siblings().length > 0
});

console.log($els.get())

演示：Fiddle

Answer 2

$('article').filter(function () {
    return $(this).siblings().length===0 ? true : false;
});

// Or in each-syntax:
$('article').each(function(){
    var $siblings = $(this).siblings(); // select (possible) siblings
    if( $siblings .length ===0 ){ // of none found
        $elem = $(this).parent(); // select parent
    }
    else{
        $elem = $siblings; // otherwise get the siblings
    }
});

此示例使用过滤器或每个过滤器，但您可以使用.map()函数替换它，我已经这样做了演示它是如何工作的

对于我们关心的人：我测试了兄弟姐妹的结果，如果你有3篇文章，并测试其中有多少兄弟姐妹，它说2。它排除了自己。

编辑：误解，更新后的答案，请查看downvotes：）

如何选择html的两级层次结构？

2 个答案: