Question

我有一个函数可以在dom周围添加一个匹配字符的元素。

因此用户搜索＆＃34; Can＆＃34;

＆＃34; <td>Canada</td>＆＃34;的每个实例例如转向

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

当用户进行下一次搜索时，旧的突出显示将被删除。

是这样的，$('.highlight').contents().unwrap();

问题是，如果用户然后尝试对加拿大进行另一次搜索，则无法找到它，因为（至少对我来说）发生了一些奇怪的事情......

该页面仍显示“加拿大＆＃39;如果我使用.html（）或.text（）警告表格单元格的内容，警报仍会显示“加拿大”。

如果我使用chrome检查器右键单击表格单元格中的单词canada，我可以看到它现在已经分割为

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

所以搜索加拿大的dom将不再找到它，而是搜索“Can＆＃39;将.....

那么这是如何拆分的，但是在提醒时我不会维持拆分，如何解决它，所以当我删除强元素时它仍然是一个字符串......？

由于

Answer 1

最好通过element.normalize确定。

unwrap()将您的元素拆分为单独的文本节点，normalize()将它们合并回来。删除突出显示后，只需使用文本循环遍历所有元素（在本例中为td）并将其标准化。

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

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