最簡單的方式來獲得元素父

假設我有元素的這種結構：最簡單的方式來獲得元素父

<div class="parent"> 
    <div class="something1"> 
     <div class="something2"> 
      <div class="something3"> 
       <div class="something4"></div> 
      </div> 
     </div> 
    </div> 
</div>

而且這樣的代碼：

$(".something4").click(function(){ 
    //i could do it like this... 
    $(this).parent().parent().parent().parent().parent(); 
});

不過，這似乎是愚蠢的，有沒有更好的方式來做到這個？

我也不能只說$(.parent)，因爲在我的網頁中有很多像這樣的div和parent。

來源

2012-03-22 Linas

您可以隨時使用.parentNode（標準JavaScript）。使用與您使用的庫中的函數/變量名稱一致的類名稱（這適用於任何語言）通常是一個糟糕的主意。讓您的類名更獨特的是一個更好的方法（例如，「scparent」，而不是「父母」，如果你的應用程序的名稱是「超級計算器」或東西）。這可以避免衝突，例如您所描述的衝突。

我要提醒使用.closest()，僅僅是因爲你可以創建這樣的功能：

function getParentElem() { 
    return $(this).closest('div'); 
}

它會抓住家長div的在你的代碼就好了，但如果在路上你添加表用於顯示數據，並在運行通過表格的子元素的功能，你必須創建一個選擇table元素另一種實現方式，因爲這是你現在想：

<div id="tableParent"> 
    <table id="dataTable"> 
     <tr id="target1"> 
      <td>Some data.</td> 
     </tr> 
    </table> 
</div>

用u在tr元素上點擊你的函數getParentElem()，你將最終獲取id =「tableParent」的div，而不是實際的父元素，即table元素。所以，除非你所有的方式通過您的代碼適當地劃定你的父類（可以是一個痛苦而並不總是有效的），你可能會遇到問題。特別是如果您在任何時候以編程方式創建元素，或者從另一個第三方庫或腳本讀取數據。

不是說不好使用.closest() ......只是指出一個可能的「陷阱」。

來源

2012-03-22 12:34:30 JoeLinux

使用.closest(selector)。這將獲得與選擇器匹配的第一個元素，從當前元素開始，並通過DOM樹進行。

$('.something4').click(function() { 
    $(this).closest('.parent'); 
});

來源

2012-03-22 12:05:34

完美謝謝。 – Linas 2012-03-22 12:11:11

@Linas如果這個答案幫助你，請註明它通過點擊對勾（'√'）旁邊所接受。謝謝！ – 2012-03-22 12:43:32

使用.closest()：

$('.something4').click(function() { 
    $(this).closest('.parent'); 
});

來源

2012-03-22 12:05:43

我想你應該試試這個

$(this).parents(".parent");

但我不知道在網頁上是其他的div這個類:)

來源

2012-03-22 12:06:53 ventsislaf

我建議加入到div父的ID，如「parent_1」等，並在每一個你磕兒子ep在相對ID

<div id="parent_1" class="parent"> 
    <div rel="1" class="something1"> 
     <div rel="1" class="something2"> 
      <div rel="1" class="something3"> 
       <div rel="1" class="something4"></div> 
      </div> 
     </div> 
    </div> 
</div> 

$(".something4").click(function(){ 
    //i could do it like this... 
    $('#parent_' + $(this).attr('rel')); 
});

來源

2012-03-22 12:07:14

最簡單的方式來獲得元素父

回答

相關問題