Выберите элемент по точному совпадению его содержимого

Хорошо, мне интересно, есть ли способ сделать :contains()селектор jQuery для выбора элементов только с той строкой, которая набрана в

например -

<p>hello</p>
<p>hello world</p>

$('p:contains("hello")').css('font-weight', 'bold');

Селектор выберет оба pэлемента и выделит их жирным шрифтом, но я хочу, чтобы он выбирал только первый.

Нет, здесь нет селектора jQuery (или CSS), который бы это делал.

Вы можете легко использовать filter:

$("p").filter(function() {
    return $(this).text() === "hello";
}).css("font-weight", "bold");

Это не селектор , но он делает свою работу. :-)

Если вы хотите обработать пробел до или после «привет», вы можете добавить $.trimтуда:

return $.trim($(this).text()) === "hello";

Для недоношенных оптимизаторов, если вам все равно, что они не совпадают <p><span>hello</span></p>и не похожи, вы можете избежать вызовов $и textиспользуя innerHTMLнапрямую:

return this.innerHTML === "hello";

... но у вас должно быть много параграфов, чтобы иметь значение, так много, что у вас, вероятно, возникнут другие проблемы в первую очередь. :-)

Попробуйте добавить расширенную псевдо-функцию:

$.expr[':'].textEquals = $.expr.createPseudo(function(arg) {
    return function( elem ) {
        return $(elem).text().match("^" + arg + "$");
    };
});

Тогда вы можете сделать:

$('p:textEquals("Hello World")');

Вы можете использовать функцию filter () jQuery для достижения этой цели.

$("p").filter(function() {
// Matches exact string   
return $(this).text() === "Hello World";
}).css("font-weight", "bold");

Так что ответ Аманду в основном работает. Однако, используя его в дикой природе, я столкнулся с некоторыми проблемами, когда вещи, которые я ожидал найти, не были найдены. Это было потому, что иногда есть случайные пробелы вокруг текста элемента. Я уверен, что если вы ищете «Hello World», вы все равно хотите, чтобы оно совпадало с «Hello World» или даже «Hello World \ n». Таким образом, я просто добавил метод «trim ()» в функцию, которая удаляет окружающие пробелы, и он начал работать лучше.

В частности ...

$.expr[':'].textEquals = function(el, i, m) {
    var searchText = m[3];
    var match = $(el).text().trim().match("^" + searchText + "$")
    return match && match.length > 0;
}

Кроме того, обратите внимание, этот ответ очень похож на Выбор ссылки по тексту (точное совпадение)

И вторичная заметка ... trimудаляет только пробелы до и после искомого текста. Он не удаляет пробелы в середине слов. Я считаю, что это желательное поведение, но вы можете изменить это, если хотите.

Я нашел способ, который работает для меня. Это не на 100% точно, но исключает все строки, которые содержат больше, чем просто слово, которое я ищу, потому что я проверяю строку, не содержащую также отдельных пробелов. Кстати, вам не нужны эти "". JQuery знает, что вы ищете строку. Убедитесь, что у вас есть только один пробел в части: contains (), иначе он не будет работать.

<p>hello</p>
<p>hello world</p>
$('p:contains(hello):not(:contains( ))').css('font-weight', 'bold');

И да, я знаю, это не сработает, если у вас есть такие вещи, как <p>helloworld</p>

Как и TJ Crowder, указанный выше, функция фильтра творит чудеса. Это не работает для меня в моем конкретном случае. Мне нужно было искать несколько таблиц и их соответствующие теги td внутри div (в этом случае диалоговое окно jQuery).

$("#MyJqueryDialog table tr td").filter(function () {
    // The following implies that there is some text inside the td tag.
    if ($.trim($(this).text()) == "Hello World!") {
       // Perform specific task.
    }
});

Надеюсь это кому-нибудь пригодится!

Однострочник, который работает с альтернативными библиотеками jQuery:

$('p').filter((i, p) => $(p).text().trim() === "hello").css('font-weight', 'bold');

И это эквивалентно a:contains("pattern")селектору jQuery :

var res = $('a').filter((i, a) => $(a).text().match(/pattern/));

.First () поможет здесь

$('p:contains("hello")').first().css('font-weight', 'bold');