Скажем, на веб-странице есть строка типа «Я простая строка», которую я хочу найти. Как бы я пошел об этом с помощью JQuery?
Скажем, на веб-странице есть строка типа «Я простая строка», которую я хочу найти. Как бы я пошел об этом с помощью JQuery?
Ответы:
JQuery имеет метод содержит. Вот фрагмент для вас:
<script type="text/javascript">
$(function() {
var foundin = $('*:contains("I am a simple string")');
});
</script>
Селектор выше выбирает любой элемент, который содержит целевую строку. Foundin будет объектом jQuery, который содержит любой соответствующий элемент. См. Информацию об API по адресу: https://api.jquery.com/contains-selector/.
С подстановочным знаком '*' следует отметить, что вы получите все элементы, включая элементы html a body, которые вам, вероятно, не нужны. Вот почему в большинстве примеров в jQuery и других местах используется $ ('div: Содержит ("Я простая строка")')
Обычно селекторы jQuery не выполняют поиск в «текстовых узлах» в DOM. Однако если вы используете функцию .contents (), текстовые узлы будут включены, тогда вы можете использовать свойство nodeType для фильтрации только текстовых узлов, а свойство nodeValue для поиска текстовой строки.
$ ('*', 'body') .andSelf () .contents () .filter (функция () { вернуть this.nodeType === 3; }) .filter (функция () { // Соответствует только тогда, когда содержит «простую строку» в любом месте текста return this.nodeValue.indexOf ('простая строка')! = -1; }) .each (функция () { // Делаем что-то с this.nodeValue });
.andSelf()
. Из api.jquery.com/andSelf : «Объекты jQuery поддерживают внутренний стек, который отслеживает изменения соответствующего набора элементов. Когда вызывается один из методов обхода DOM, новый набор элементов помещается в стек. Если предыдущий набор элементов также желателен, и может помочь .andSelf (). " Я не вижу предыдущего контекста, что мне не хватает?
Это выберет только элементы листа, которые содержат «Я простая строка».
$('*:contains("I am a simple string")').each(function(){
if($(this).children().length < 1)
$(this).css("border","solid 2px red") });
Вставьте следующее в адресную строку, чтобы проверить это.
javascript: $('*:contains("I am a simple string")').each(function(){ if($(this).children().length < 1) $(this).css("border","solid 2px red") }); return false;
Если вы хотите захватить просто «Я простая строка» . Сначала оберните текст в такой элемент.
$('*:contains("I am a simple string")').each(function(){
if($(this).children().length < 1)
$(this).html(
$(this).text().replace(
/"I am a simple string"/
,'<span containsStringImLookingFor="true">"I am a simple string"</span>'
)
)
});
а затем сделай это.
$('*[containsStringImLookingFor]').css("border","solid 2px red");
Если вы просто хотите, чтобы узел находился ближе всего к искомому тексту, вы можете использовать это:
$('*:contains("my text"):last');
Это даже будет работать, если ваш HTML выглядит так:
<p> blah blah <strong>my <em>text</em></strong></p>
Использование вышеупомянутого селектора найдет <strong>
тег, так как это последний тег, который содержит всю эту строку.
<p>my text <b>my text</b></p>
- удаление предков <b>
тега проиграть другой матч
Взгляните на основной момент (плагин jQuery).
Просто добавив к ответу Тони Миллера, так как это дало мне 90% к тому, что я искал, но все равно не сработало. Добавление .length > 0;
в конец его кода заставило мой скрипт работать.
$(function() {
var foundin = $('*:contains("I am a simple string")').length > 0;
});
foundin += '*';
эта функция должна работать. в основном выполняет рекурсивный поиск, пока мы не получим четкий список листовых узлов.
function distinctNodes(search, element) {
var d, e, ef;
e = [];
ef = [];
if (element) {
d = $(":contains(\""+ search + "\"):not(script)", element);
}
else {
d = $(":contains(\""+ search + "\"):not(script)");
}
if (d.length == 1) {
e.push(d[0]);
}
else {
d.each(function () {
var i, r = distinctNodes(search, this);
if (r.length === 0) {
e.push(this);
}
else {
for (i = 0; i < r.length; ++i) {
e.push(r[i]);
}
}
});
}
$.each(e, function () {
for (var i = 0; i < ef.length; ++i) {
if (this === ef[i]) return;
}
ef.push(this);
});
return ef;
}