選擇特定href的第一個實例

如何選擇只包含特定href的鏈接的第一個實例，解決方案可以是css或javascript，我更喜歡css，因爲我需要進行樣式更改選擇了正確的鏈接，但我甚至不知道css可以做我需要的。選擇特定href的第一個實例

<ul class="digital-downloads"> 
    <li> <a href="order_5129865a7d832&amp;download_file=936">Link</a></li> 
    <li> <a href="order_5129870f01410&amp;download_file=936">Link</a></li> 
    <li> <a href="order_512a033229f68&amp;download_file=935">Link</a></li> 
    <li> <a href="order_512a048548f68&amp;download_file=935">Link</a></li> 
    <li> <a href="order_512a0c31734a6&amp;download_file=932">Link</a></li> 
</ul>

從上面的代碼可以看出，前兩個鏈接並不相同，但它們有相同的結尾。我需要一種方法來只選擇第一含download_file=936或download_file=935或download_file=932等鏈接的實例

李的數量將永遠是不同的，以及同一鏈接的數量，所以我不能選擇例如第三個鏈接href不會總是935在第三個li，它可能是936或932取決於具體情況。

來源

2013-02-24 user2104522

$('a[href*="download_file=935"]:first')

只是在CSS中做到這一點非常複雜。

來源

2013-02-24 14:08:01 Plynx

你將不得不重複每個值的jQuery選擇器，這可能很麻煩（儘管不如CSS）。 – BoltClock 2013-02-24 14:08:55

使用「attribute ends with」選擇器可能會更好： '$（'a [href $ =「download_file = 935」]：first'）'。在這種情況下不會有太大區別，但如果知道'download_file'部分始終位於URL的末尾，那麼精確度總是很好。 – 2013-02-24 14:13:10

使用JavaScript：

var first = document.querySelector('a[href$="936"]'); 

first.className = 'first';

JS Fiddle demo。

這種方法爲了允許CSS樣式添加了CSS類名，所以應該結合每種方法的好處，只要瀏覽器支持document.querySelector()即可。

來源

2013-02-24 14:04:09

你必須重複這一過程，每個值，這可能是麻煩的。 – BoltClock 2013-02-24 14:09:12

謝謝你的建議，它在FF中工作，但不會在IE中工作，所以我不得不使用下面的解決方案，並使用.addClass（）而不是.className – user2104522 2013-02-24 23:59:35

您可以將filter對一個jQuery選擇，遍歷它們，同時對HREF從之前比較：

var last; 
var firsts = $(".digital-downloads li a").filter(function(){ 
    var link = this.href.match(/download_file=\d+$/)[0]; 
    if (link == last) 
     return false; // we had this before, don't select 
    else { 
     last = link; 
     return true; // we've found a new one! 
    } 
});

總之，並採取不匹配的正則表達式的護理：

… 
    var m = this.href.match(/download_file=\d+$/); 
    return m && m[0] != last && (last=m[0],true); 
…

來源

2013-02-24 14:06:43 Bergi

使用正則表達式：

$(function() { 
var count = 0; 
$('a').each(function() { 
    var match = $(this).attr('href').match(/(.*download_file=\d+)/); 
    if (match !== null && count == 0) { 
     alert(match.pop()); 
     count++; 
    } 
}); 
});

http://jsfiddle.net/vzJVa/

來源

2013-02-24 14:08:11 gmaliar

選擇特定href的第一個實例

回答

相關問題