Найти элемент DOM, содержащий строку, совпадающую с регулярным выражением

Question

Мне нужно найти на странице HTML все текстовые фрагменты, соответствующие определенному регулярному выражению (то есть мне нужно игнорировать теги, чтобы '< span>First name: < /span>< br/>< b>John< /b>' совпадало с 'First name: John'), и затем выделить эти найденные фрагменты (путем украшения новыми элементамии применение пользовательских стилей CSS) и быть в состоянии найти эти фрагменты, например, иметь возможность прокручивать их в поле зрения.Функциональность схожа с тем, что делает плагин для браузера Skype с номерами телефонов, указанными на странице.

Answer 1

Вы можете либо рекурсивно пройтись по DOM, просматривая свойство textContent , либо innerText (в зависимости от ситуации) элементов, либо вы можете использовать цикл по коллекции, возвращенной getElementsByTagName .В любом случае, после того как вы определили текст и родительский элемент, вам нужно решить, как его заменить.

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

Answer 2

Вы можете использовать jQuery селекторы , чтобы получить <b> теги, содержащие John, которые идут после тега <span>, который содержит First name:, а затем, например, применить стиль:

$("span:contains('First name:') ~ b:contains('John')").css('color','red');

Вот пример: http://jsfiddle.net/XzwNj/

Answer 3

Вы пробовали что-то подобное?

document.body.innerHTML.replace(/<\/?[^>]+>/g, '')