jquery - jquery unwrap() sting split 问题

Question

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

所以用户搜索“可以”

例如，“”的每个实例都<td>Canada</td>变成

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

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

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

问题是，如果用户然后尝试再次搜索加拿大，它将找不到，因为（至少对我而言）发生了一些奇怪的事情......

该页面仍显示“加拿大”一词，如果我使用 .html() 或 .text() 提醒表格单元格的内容，则警报仍显示“加拿大”。

如果我使用 chrome 检查器右键单击表格单元格中的加拿大一词，我可以看到它现在被拆分为

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

因此，搜索加拿大的 dom 将不再找到它，但搜索“Can”会......

那么这种拆分是怎么回事，但是在警报时不会保持拆分，我该如何解决它，所以当我删除强元素时它仍然是一个字符串......？

谢谢

score 2 · Accepted Answer

这最好通过element.normalize来解决。

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

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

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

1 回答 1