如何选择所有带有特定文本的锚标签

73

给定多个锚标记：

<a class="myclass" href="...">My Text</a>

如何选择与班级匹配并带有特定文本的锚点。例如，选择所有带有类别“ myclass”和文本：“ My Text”的锚点

jquery html css-selectors

— 杰夫·阿普福德
source

130

$("a.myclass:contains('My Text')")

— 戴维·莫顿
source

谢谢大卫。如何进行完全比对而不是包含比较。我只想要完全匹配的元素。

— Geoff Appleford 2010年

我只会在链接和书签之间添加区别：$('a.myclass[href]:contains("My Text")')

— Marko Dumic

1

@geoff：没有内置的方法来获得完全匹配。您可以使用.each函数来遍历它们，也可以编写自己的jQuery选择器。埃里克·马丁（Eric Martin）为精确比赛写了一篇不错的文章。您可以在这里找到它：ericmmartin.com/creating-a-custom-jquery-selector

— David Morton 2010年

正是我所需要的。谢谢。

— Geoff Appleford 2010年

2

如果没有一个班级可以识别该怎么办？

— Amalgovinus '16

15

您可以创建类似于:contains完全匹配的自定义选择器：

$.expr[':'].containsexactly = function(obj, index, meta, stack) 
{  
    return $(obj).text() === meta[3];
}; 

var myAs = $("a.myclass:containsexactly('My Text')");

— 安迪
source

4

如果仅当锚文本包含特定字符串时才感到困扰，请使用@Dave Morton的解决方案。但是，如果您想完全匹配特定的字符串，我建议使用以下方法：

$.fn.textEquals = function(txt) {
    return $(this).text() == txt;
}

$(document).ready(function() {
    console.log($("a").textEquals("Hello"));
    console.log($("a").textEquals("Hefllo"))
});

<a href="blah">Hello</a>

略有改进的版本（带有第二个修整参数）：

$.fn.textEquals = function(txt,trim) {
    var text = (trim) ? $.trim($(this).text()) : $(this).text();
    return text == txt;
}

$(document).ready(function() {
    console.log($("a.myclass").textEquals("Hello")); // true
    console.log($("a.anotherClass").textEquals("Foo", true)); // true
    console.log($("a.anotherClass").textEquals("Foo")); // false
});

<a class="myclass" href="blah">Hello</a>
<a class="anotherClass" href="blah">   Foo</a>

— karim79
source

3

首先，选择所有包含“ MY text”的标签。然后，对于每个精确匹配，如果匹配条件，则执行您想做的任何事情。

$(document).ready(function () {
    $("a:contains('My Text')").each(function () {
        $store = $(this).text();

        if ($store == 'My Text') {
            //do Anything.....
        }
    });
});

— 莫妮卡
source

首先选择所有包含“ MY text”的标签，然后进行完全匹配（如果有条件）。然后做你想做的事。

— Monika 2014年

添加到您的答案中

— Dinistro 2014年

0

如果您不知道所需对象的类别，而只想查看链接文本，则可以使用

$(".myClass:contains('My Text')")

如果您甚至不知道它是哪个元素（例如a，p，link等），都可以使用

$(":contains('My Text')")

（只需将零件:留空即可。）

我必须在此处添加，它调出了从<html>-Tag到所需元素的所有元素。我可以提供一种解决方案.last()，但只能在只有一个元素的情况下使用。也许很时髦在这里知道更好的解决方案。

实际上，这应该是已接受答案的补充，尤其是@Amalgovinus问题。

— mmika1000
source

-2

我认为这应该适用于完全匹配的事物。

$("a.myclass").html() == "your text"

— 穆罕默德·坦威
source

不起作用。 html()仅适用于匹配元素集合（api.jquery.com/html）中的第一个元素。您需要控制流或迭代来遍历每个锚点，例如each()。

— dyoo 2015年