Как я могу использовать jQuery для выбора элемента, который непосредственно содержит определенный текст? - PullRequest
Новая
       24

Как я могу использовать jQuery для выбора элемента, который непосредственно содержит определенный текст?

0 голосов
/ 10 марта 2012

Селектор 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 ]

3 голосов
/ 10 марта 2012

Редактировать: Начиная с вашего обновленного кода, я думаю, вам нужно использовать .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');

DEMO

Дайте мне знать, если это работает..

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 с текстом «happy».

DEMO

0 голосов
/ 10 марта 2012

Попробуйте использовать .filter() для более конкретной проверки: 

alert(
    $("ul").filter(function(){return $.trim(this.childNodes[0].nodeValue) === "happy"})[0].id
);​

Он проверяет nodeValue первого дочернего узла каждого ul, чтобы определить, является ли он текстовым узлом, который содержит «happy».

...