jquery unwrap() sting split issue

Question

У меня есть функция, которая добавляет элемент в dom вокруг совпадающих символов.

Так пользователь выполняет поиск «Can»

каждый экземпляр «<td>Canada</td>», например, превращается в

<td><strong class='highlight'>Can</strong>Ada</td> 

Когда пользователь делает следующий поиск старой изюминка удаляется.

как так, $('.highlight').contents().unwrap();

вопрос, если пользователь затем пытается сделать еще один поиск в Канаде не будет найден, потому что (для меня по крайней мере) что-то странное происходит ...

страница все еще показывает слово «Канада», и если я предупреждаю содержимое ячейки таблицы, используя либо .html(), либо .text(), предупреждение все еще показывает «Канада».

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

<td> 
    "Can" 
    "Ada" 
</td> 

Таким образом, поиск в йоте для канады больше не найти, но поиск для «Can» было бы ...

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

Благодаря

Answer 1

Это лучше всего фиксируется через element.normalize.

unwrap() разделяет ваш элемент на отдельные текстовые узлы, а normalize() объединит их вместе. После того, как вы удалите выделение, просто пропустите все элементы с текстом (в данном случае td) и нормализуйте их.

$('.highlight').contents().unwrap(); 

$('td').each(function(index,td){ 
    td.normalize(); 
});