Как я могу использовать jQuery, чтобы выбрать элемент, который непосредственно содержит определенный текст?
Селектор jQuery :contains(text)
выбирает элемент, если соответствующий текст появляется непосредственно внутри выбранного элемента, в любом из потомков этого элемента или их комбинации.
Я хочу выбрать элемент тогда и только тогда, когда соответствующий текст появляется непосредственно внутри выбранного элемента. Что я должен делать?
Например,
<ul>
<li id="1">
<a><img src="la.gif"></a>
happy birthday
<ul><li>radom</li></ul>
</li>
<li id="2">
<a><img src="la.gif"></a>
sad
<ul><li>happy</li></ul>
</li>
</ul>
Я хочу выбрать li
который содержит слово "счастливый" (не выбирайте li
если только его потомок содержит слово "счастливый"). Только тогда li#1
должен быть выбран.
Следующее НЕ делает то, что я хочу, потому что он выберет оба li#1
а также li#2
:
$('li:contains("happy")');
2 ответа
Изменить: как из вашего обновленного кода, я думаю, что вам нужно использовать .contents()
и проверить на nodeType
чтобы убедиться, что это текстовый узел, а затем сравните его с нужным вам текстом.
$('ul li').contents().each( function () {
if (this.nodeType == Node.TEXT_NODE && this.nodeValue.match(/happy/)) {
$(this).closest('li').css('border', '1px solid red');
}
});
или используя .filter()
,
$('ul li').contents().filter( function () {
if (this.nodeType == Node.TEXT_NODE && this.nodeValue.match(/happy/)) {
return true;
}
}).closest('li').css('border', '1px solid red');
Дайте мне знать, если это работает..
ul
должен содержать только li
теги.. как показано ниже,
<ul>
<li id="1">happy</li>
<li id="2">sad <div>happy</div></li>
</ul>
Предполагая, что ваш HTML такой, ниже приведен скрипт для получения первого списка,
$('ul li').filter (function () {
if ($(this).text() == 'happy') return true;
});
.filter
вернет li
с текстом "счастливый".
Попробуйте использовать .filter()
для более конкретной проверки:
alert(
$("ul").filter(function(){return $.trim(this.childNodes[0].nodeValue) === "happy"})[0].id
);
Это проверяет nodeValue
первого дочернего узла каждого ul
чтобы увидеть, если это текстовый узел, который содержит "счастливый".