如何获取“href”属性包含单词“youtube”的每个“a”标签？答案

【问题标题】：How can i get every "a" tag which "href" attribute contain word "youtube"?如何获取“href”属性包含单词“youtube”的每个“a”标签？
【发布时间】：2011-10-02 00:20:52
【问题描述】：

我想捕获每个a 标签，其中href 属性包含单词youtube。我需要使用 jquery。

【问题讨论】：

标签： javascript jquery html css jquery-selectors

【解决方案1】：

$('a[href*="youtube"]')

有关更多选择器，请参阅 jQuery API 的 Selectors 部分。

【讨论】：

@Ray Toal：完成。（虽然我觉得奇怪的是 jQuery 说引号是“强制性的”，尽管选择器在没有它们的情况下也能完美工作。）

【解决方案2】：

Attribute Contains Selector:

$('a[href*="youtube"]');

【讨论】：

【解决方案3】：

你总是可以使用“过滤器”：

var allYoutubes = $('a').filter(function() { return /youtube/.test(this.href); });

您可以使用更高级的选择器，但这很简单明了，而且可能更快，因为库不需要进行确定选择器含义的工作。这主要是口味问题。

【讨论】：

只是出于好奇：与此处的其他答案相比，您能解释一下这种方法吗？
@Caspar：jQuery 的filter 对集合中的所有元素运行测试。如果测试为真，则保留该元素；如果它是假的，它就会把它扔掉。因此，这将选择页面上的所有<a> 元素并丢弃任何未通过测试的元素（在这种情况下，测试是“元素的href 属性是否包含'youtube'？”）
@reid，感谢您的解释，但我想知道这种方法与其他方法相比有何不同。例如效率、性能、兼容性等。
啊，现在我明白了，这也可以通过 i 选项不区分大小写，非常棒！

【解决方案4】：

很简单...

$('a[href*="youtube"]')

http://api.jquery.com/attribute-contains-selector/ http://api.jquery.com/category/selectors/

【讨论】：

【解决方案5】：

这些其他答案很棒；但如果你有兴趣，做一个纯 JS（没有 jQuery）的替代方案并不难

function getYouTubeLinks() {

    var links = document.getElementsByTagName("a");
    var ytlinks = [];
       for(var i=0,l=links.length;i<l;i++){
           if(links[i].href.replace("http://","").indexOf("youtube.com") === 0) {
            ytlinks.push(links[i]);  
           } 
        } 
   return ytlinks;
}

var youtube = getYouTubeLinks();
for(var i=0,l=youtube.length;i<l;i++){
    youtube[i].style.color = "pink";   
}

最好去掉“www”。以及“https://”。

【讨论】：

尝试像这样循环：(i=0,l=links.length;i<l;i++) 所以长度不需要一直被蜜蜂评估;)。
@Caspar 好点。随意编辑答案（如果你不这样做，我会，但这是你的主意）——毕竟这就是 SO 的意义所在。