Замена текста ссылкой в ​​jQuery

Question

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

Текст может представлять собой огромную массу текста, html, изображений и т. Д., И я хочу найти первое (или все) положение определенной строки и заменить его на элемент, который я создайте с помощью $('< span>').

Использование простой text.replace('the string', $('< span>')); не делает трюк (я остался с [object Object], а не фактической < span>, что я хочу.

Причина не только вводить прямой HTML, потому что я хочу, чтобы сохранить все привязки, связанные с объектом, который я создаю, и выполнение замены с помощью специального идентификатора, а затем привязка привязок к ID после изменения HTML, кажется немного грязным.

Спасибо за помощь! :)

Answer 1

Вы более чем вероятно, хотите выделить плагин и просто изменить, чтобы обернуть ссылку, если хотите.

http://www.unwrongest.com/projects/highlight/

Answer 2

Это не так просто. Как только вы подобрали text(), у вас есть простая строка без информации о узле узла, поэтому замена на нее не изменит HTML DOM.

Что вам нужно сделать, так это поиск каждого текстового узла внутри дерева по одному. И, к сожалению, jQuery не оказывает существенной помощи при работе с текстовыми узлами.

Вы можете использовать функцию findText от this question. Это использование было бы заменить каждую «строку» с пустым <span>:

findText(document.body, /the string/g, function(node, match) { 
    var span= document.createElement('span'); 
    node.splitText(match.index+match[0].length); 
    node.data= node.data.slice(0, match.index); 
    node.parentNode.insertBefore(span, node.nextSibling); 
}); 

(. Если вам нужно найти текст через различные текстовые узлы и элементы, это much more complicated proposition)

Answer 3

Для простого решения

Если вам нужен более детализированной элемент, вам необходимо добавить элемент на позиции, которую вы хотите.

$("<span/>").appendTo(element); 

Как и в вашем примере, он заменяет текст с object.toString()