使用jQuery查找并包装跨度中文本字符的每个实例

我们想在页面上找到一个字符的每个实例（特别是， • ），然后将它包装在一个span中，这样我们就可以设置它们的样式。 它们可以在各种元素中，多次，以及整个DOM：

，

，

等。

我们尝试过这里找到的一个方法，它涉及匹配一个字符串并在其周围包裹一个span，但它似乎只匹配并包装任何给定元素中的第一个实例，并忽略同一元素中的任何后续实例。 例如，对于

•

•

，两者都匹配并包装，但是

blah • blah • blah • blah

，只有第一个匹配并包装。

这是我们尝试的：

 $('*:contains("•")').each(function() { if($(this).children().length < 1) $(this).html($(this).text().replace('•','•')) }); 

不确定它是否与if行有关……这是我们唯一模糊的部分。 然而，并没有特别投入这种方法，所以如果有更清洁的东西，让我们听听吧！

Answer 1

这个怎么样：-

演示

 $('body:contains("•")').contents().each(function () { if (this.nodeType == 3) { $(this).parent().html(function (_, oldValue) { return oldValue.replace(/•/g, "$&") }) } }); 

尽量避免使用* 。 甚至可能是body 。 尽量使用最外面的容器。

这也应该有效

演示

 $('body:contains("•")').contents().each(function () { if (this.nodeType == 1) { //Look for only element Nodes $(this).html(function (_, oldValue) { return oldValue.replace(/•/g, "$&") }) } 

节点类型

Answer 2

 $("*").each(function() { if($(this).children().length==0) { $(this).html($(this).html().replace(/•/g, '•')); } }); 

这个答案是基于这个问题的

Js小提琴示例