Выбрать только элементы, которые непосредственно содержат текст

Так что у меня что-то вроде этого:Выбрать только элементы, которые непосредственно содержат текст

<div class="main"> 
    <div class="useless"> 
    text I don't want.  
    </div> 
    <div class="useless"> 
    text I don't want.  
    </div> 
    <div class="narrow"> 
    text I'm searching for 
    </div> 
    <div class="useless"> 
    text I don't want.  
    </div> 
    <div class="useless"> 
    text I don't want.  
    </div> 
</div>

Использование JQuery это прекрасно :contains selector, я могу искать по ключевому слову, но он будет возвращать как родителя и ребенка.

Я бы хотел, чтобы он возвращал только те элементы, которые содержат только слово, которое я ищу.

Stackoverflow рекомендуется использовать this link как предыдущую попытку, но кажется крайне неуклюжим, так как он сканирует все узлы dom и требует много нечеткого кода.

источник

2013-08-06 RandallB

Отметить это как обман вопроса, на который вы ссылались; в то время как я ценю, что вы не удовлетворены ответами там, по причинам, которые вы дали, это все тот же вопрос, и вы не задали никаких конкретных требований, не заданных в другом вопросе. Соответствующий курс действий, вероятно, должен состоять в том, чтобы пожертвовать на этот вопрос щедрость, если/когда вы сможете это сделать. Я все еще интересуюсь этим и смотрю на него. –

* «кажется очень неуклюжим, так как он ползает на всех узлах dom» *. Это то, что вам нужно делать в любом случае. Вы также можете выбрать все узлы сразу с помощью '$ ('*')', а затем перебрать их, но в любом случае вам нужно пройти все узлы. –

Возможно, вам нужен более продвинутый селектор, например [jQuery XPath plugin] (https://github.com/ilinsky/jquery-xpath). Если вы решите использовать xpath, возможно, [этот ответ] (http://stackoverflow.com/a/2994336/771578) также поможет вам. –

Этот сценарий будет найти все узлы, которые содержат определенный текст. Он также позволит вам выполнять любые строковые тесты в тексте (регулярное выражение и т. Д.).

function getNodesThatContain(text) { 
    var textNodes = $(document).find(":not(iframe, script, style)") 
     .contents().filter( 
      function() { 
      return this.nodeType == 3 
      && this.textContent.indexOf(text) > -1; 
    }); 
    return textNodes.parent(); 
}; 

console.log(getNodesThatContain("test"));

Вот скрипка для тестирования: http://jsfiddle.net/85qEh/4/

PS - Для увеличенной скорости используйте другой селектор верхнего уровня. Например, если вам нужно только внутри #container, то вы бы var textNodes = $('#container')...

источник

2013-08-06 19:39:42

Конечно, более читабельны и кратки, чем решение bobince. +1. Не уверен, как производительность будет сравнивать, хотя это может иметь значение. –

Просто протестировал его на примере, который вы показали http://jsfiddle.net/85qEh/3/ Похоже, что JQuery де-дублирует набор результатов для вас. –

Да, я попробовал только сейчас и нашел то же самое - свою ошибку. Кроме того, извините, уже отредактировал мой комментарий после того, как понял, что ошибся, и мне уже слишком поздно редактировать его сейчас, поэтому ваш комментарий выглядит так, будто вы никому не отвечаете. Сожалею. : P –

-2

Try This В JS

$('div >:contains("text Im searching for")')

источник

2013-08-06 19:00:50 YashPatel

Даунвит не мой, но обратите внимание, что это часть «неуклюжих» решений, доступных в связанном вопросе. –

И более того, это не работает, как объяснено в комментариях к другому вопросу. -1 –

Проблема, обнаруженная другими: http://jsfiddle.net/DM4vz/2/ Если вы добавите родителя выше этого, поиск завершится неудачно. – RandallB

Решение, которое предусмотрено в другом вопросе, как указано выше, но как не высоко оцененной решение очевидно, это сделать так:

$("div:contains('searching')").filter(function() { 
    return (
    $(this).clone() //clone the element 
    .children() //select all the children 
    .remove() //remove all the children 
    .end() //again go back to selected element 
    .filter(":contains('searching')").length > 0) 
}).css('border', 'solid 1px black');

I добавьте его менее clunky, чем писать огромную вещь, чтобы сканировать все узлы DOM и действительно должны влиять на меньшее количество мест, когда они узко ограничены.

Если у кого-то еще есть лучшие идеи, я определенно заинтересован.

http://jsfiddle.net/TT7dR/42/

источник

2013-08-06 19:08:38 RandallB

Это взломанный и неэффективный, но похоже, что он будет работать (и комментарии четко объясняют логику, лежащую в его основе). Ориентировочный +1, но, конечно же, есть более короткий и более чистый способ? –

Но вот и другие divs тоже ограничены. – WooCaSh

JSFiddle не работает. Я случайно использовал предыдущую ссылку, которая содержала плохую разметку и напрямую не касалась вопроса. Я обновил его, и теперь он дает лучшее представление. – RandallB

Выбрать только элементы, которые непосредственно содержат текст

ответ

Смежные вопросы