通過jQuery深度去除HTML元素

我在我的HTML頁面中有nested lists，這些列表由一個jQuery代碼管理，這個代碼爲用戶提供了向列表節點添加行和子元素的交互。每個列表可以包含一個div用於添加一個新的列表作爲孩子。我的問題是我想補充一個動態限制器深的元素，我可以創造：通過jQuery深度去除HTML元素

<ul> 
    <li> 
     <ul> 
      <li><div class="add-child"></div></li> 
      <li><div class="add-child"></div></li> 
      <li><div class="add-row"></div></li> 
     </ul> 
    </li> 
    <li><div class="add-child"></div></li> 
    <li><div class="add-child"></div></li> 
    <li><div class="add-row"></div></li> 
</ul>

深可能會改變未來，我知道如果我我可以簡單地使用靜態選擇這樣的想a max of 3 levels of deepness工作：

$('li li li .add-child').remove();

但我想一個動態的解決方案，通過設置PHP深，然後通過jQuery的限制吧，怎麼可能是我的做法呢？

來源

2013-01-01 vitto

jQuery的代碼添加嵌套UL必須檢查的深度，且僅當限制尚未達到繼續。那是jQuery編碼你自己的代碼，還是你使用第三方插件？ –

這只是一個頁面的代碼，所以我決定不爲此開發插件。 – vitto

你的意思是像這樣？

$('.add-child').each(function() { 
    if($(this).parents('li').length > someDepthSetByPHP) 
    { 
     $(this).remove(); 
    } 
});

jsfiddle example

來源

2013-01-01 18:17:34

$('.add-child') 
    .filter(function(){ 
     return $(this).parents('li').length > 2; 
    }) 
    .remove();

我知道，你說你不需要的插件，但我無法抗拒：d

$.fn.filterIfHasNParents = function(n, selector){ 
    var depth = n || 1; 
    return $(this).filter(function(){ 
     return $(this).parents(selector || '').length > depth - 1; 
    }); 
}

，然後用它作爲：

$('.add-child').filterIfHasNParents(3, 'li').remove();

來源

2013-01-01 18:17:21

對於插件+1，對其他人可能會有用;） – vitto

通過jQuery深度去除HTML元素

回答

相關問題