查找與jQuery

Question

最接近共享頭

說我有以下HTML：

<h1>First header</h1> 

<h2>Second header</h2> 
<div>First div</div> 
<div>Second div</div> 

<h2>Third header</h2> 
<div>Third div</div> 
<div>Fourth div</div> 

我需要的是找到由所有的div共用最接近頭的通用方法。在這種情況下，它將是<h1>標題。但標記也可以是：

<h1>First header</h1> 

<h2>Second header</h2> 

<h3>Third header</h3> 
<div>First div</div> 
<div>Second div</div> 

<h3>Fourth header</h3> 
<div>Third div</div> 
<div>Fourth div</div> 

在這種情況下，第一共用頭將是<h2>頭。更復雜的情況也是可能的。

我認爲最主要的困難是最接近（）和父母（）方法沒有幫助，因爲div不是嵌套在標題下。 prevAll（）方法似乎是最有前途的，但我還沒有找到正確的方法。任何幫助將不勝感激。

Answer 1

如果您正在查找的標題是您可以使用smth的元素的最後一個單一公共標題。這樣

// Get the collection of the all headers 
var $h = $('div').siblings('h1,h2,h3,h4,h5,h6'); 

// Find single headers 
var $singles = $h.filter(function(i, el){ 
    // The hX tag name should be only one in the collection 
    return $h.filter(el.tagName).length === 1 
}); 

// Get the last single header 
$singles.last().css('color', 'red') 

但是這並不能掩蓋像h1(h2(h2;h3))對於這樣的情況情況下，你應該手動組的div，然後團的基團 - 等等。

PS：這個想法，或假設，後面的代碼很簡單：常見的（搜索）頭始終​​是一個專業級別。從您的示例中，我們可以寫下邏輯分組： h1(h2;h2)和h1(h2(h3;h3))。現在的任務是找到最深的組，其中包含所有的魚。從示例中可以清楚地看出，這樣的組容器始終是單一的邏輯樹。 現在siblings()我們得到所有的標題，通過計數1過濾它們並採取最後一個。

但是，這隻適用於邏輯組包含具有相同標籤名稱的標頭，並且任何嵌套組都沒有與任何祖先相同的標籤名稱。例如，這樣的邏輯分組不會工作h1(h2(h2;h2) - 這裏匹配的標題將是h1。

希望它有幫助。