限制嵌套，重複的元素結構

給定一個重複，嵌套的元素結構，例如jQuery選擇器的範圍：限制嵌套，重複的元素結構

<div class="A"> 

    <span class="B></span> 
    <span class="B></span> 

    <span class="B"> 
    <div class="A"> 
     <span class="B"></span> 
    </div class="A"> 
    </span> 

</div>

如何選擇最後<span class="B"></span>是根<div class="A"></div>元素的直接子？

我累了：

div.A > class.B

...但（正確）的最後一個元素是不是根<div class="A"></div>元素的直接孩子，這也匹配。

來源

2012-04-12 Jack

你既可以添加，以使嵌套搜索更容易一些ID，類或數據級的對象，或者你可以做到這一點輕微的hackish版本：

$('div.A').first().children('span.B').last();

我會建議增加一個數據級別，id或其他類來處理級別。

例如，您的HTML更改爲：

<div class="A" data-level="first"> 

    <span class="B" data-level="second"></span> 
    <span class="B" data-level="second"></span> 

    <span class="B" data-level="second"> 
    <div class="A" data-level="third"> 
     <span class="B" data-level="fourth"></span> 
    </div> 
    </span> 

</div>

，你可以做這樣的事情：

$('span.B[data-level="second"]').last();

等

來源

2012-04-12 19:54:59 Evan

通過數據級你的意思是我應該使用''元素的某些允許現有屬性，並用它來存儲深度''元素？例如在'title'屬性中？由於ID必須是唯一的，我無法真正添加ID。 – Jack 2012-04-12 19:58:11

請參閱我的編輯。你的html稍微有點畸形，我也修正了這個問題 – Evan 2012-04-12 20:02:09

是'data-level'一個允許的屬性？ – Jack 2012-04-12 20:06:41

jQuery的有:last選擇。目前還不完全清楚你想要選擇哪個對象。

如果你想在最後<span class="B"></span>是根<div class="A">的直接孩子，那麼你有以下選項：

1）給出根一個標識類：

<div class="A root"> 

    <span class="B></span> 
    <span class="B></span> 

    <span class="B"> 
    <div class="A"> 
     <span class="B"></span> 
    </div> 
    </span> 

</div>

而這個選擇：

A.root > .B:last

2）指定的根對象的父對象，以確定它：

body > .A > .B:last

3）使用一些代碼來識別根對象：

$(".A").filter(function() { 
    // filter out items that have an "A" class as a parent 
    return($(this).parents(".A").length == 0); 
}).children(".B:last");

來源

2012-04-12 20:01:31 jfriend00

問題是模式重複。它是通過遞歸函數調用生成的。我無法添加任何獨特的根元素。 – Jack 2012-04-12 20:02:55

@傑克 - 也許我不明白你正在嘗試做什麼。我以爲你想要最後一個B元素，它是頂級「A」元素的直接子元素。要做到這一點，您必須以某種方式確定頂級「A」元素。我的新選項3）使用代碼來識別它。如果你試圖做一些不同的事情，那麼請解釋一下你想做的事情，因爲它不是特別清楚。 – jfriend00 2012-04-12 20:08:14

限制嵌套，重複的元素結構

回答

相關問題