jQuery針對特定鏈接的最佳方式

Question

注意：這是一個最好的方式，而不是如何問題。

我有一個UL內的幾個鏈接，我想定位但不是每一個標籤。雖然我知道我可以通過ID來定位每個元素，但我想知道該任務的最佳實踐（最優化選擇，最小代碼量）。

$("#id").find("a").click(function(){ 
    //run function      
});  

標記：

<nav id="id">  
    <ul> 
    <li id="want-01"><a href="#">link</a></li> 
    <li id="want-02"><a href="#">link</a></li> 
    <li id="want-03"><a href="#">link</a></li> 
    <li id="dont-want-01"><a href="#">link</a></li> 
    <li id="dont-want-02"><a href="#">link</a></li> 
    <li id="want-04"><a href="#">link</a></li> 
    <li id="want-05"><a href="#">link</a></li> 
    </ul>  
</nav> 

Answer 1

使用一類的就在這裏似乎是適當的。創建一個新的類，聲明'li_link'並將其添加到要鏈接到的li元素。然後將你的點擊處理程序應用於所有與該類相關的元素，例如。

$('.li_link').click(function() {...}); 

如果要更改動態處理的li元素，可以考慮使用實時事件。這使您可以添加和刪除li元素中的'li_link'類，並且點擊處理程序將自動應用或停止應用於li元素。

要建立現場活動使用這樣的事情：

$('.li_link').live('click', function() {...}); 

Answer 2

即使世界實在是沒辦法與HTML做到這一點，但如果你implmented一個rel：attr或類，你可以很方便地選擇它。

<nav id="id">  
    <ul> 
    <li id="want-01" rel="wanted"><a href="#">link</a></li> 
    <li id="want-02" rel="wanted"><a href="#">link</a></li> 
    <li id="want-03" rel="wanted"><a href="#">link</a></li> 
    <li id="dont-want-01"><a href="#">link</a></li> 
    <li id="dont-want-02"><a href="#">link</a></li> 
    <li id="want-04" rel="wanted"> <a href="#">link</a></li> 
    <li id="want-05" rel="wanted"><a href="#">link</a></li> 
    </ul>  
</nav> 

$("#id").find('li[rel=wanted]').children(); 

Answer 3

$("#id").find("a").not("#dont-want-01 a, #dont-want-02 a").click(function(){ 

});