javascript - 选择与链接直接相邻的标点符号，将它们包裹在 span 中

Question

想使用 jQuery 来:

1. 选择任何标点符号(表示 . , ; : ' " “ ” ‘ ’ 等)然后
2. 将span中的标点符号换行s.

因此:

<div id="mydiv">
  Lorem ipsum
  <a href="#">dolor sit amet</a>,
  consectetur
  &ldquo;<a href="#">adipisicing elit</a>&rdquo;.
</div>

变成这样:

<div id="mydiv">
  Lorem ipsum
  <a href="#">dolor sit amet</a><span>,</span>
  consectetur
  <span>&ldquo;</span><a href="#">adipisicing elit</a><span>&rdquo;.</span>
</div>

(顺便说一句，&ldquo 和 ” 是引号。)

div中的内容不是固定的。也可能有这样的情况，链接旁边有多个标点符号(如上所示，”. 变为 <span>&rdquo;.</span>)

非常感谢任何帮助!!

---

在选择文本节点方面与这个问题有点相似(但不完全)？ Using jQuery, how to modify text outside of tags?

Answer 1

这似乎可行:

尝试一下: http://jsfiddle.net/GutKg/1/

var $div = $('#mydiv');

var html = $div.html();

html = html.replace(/([^\s\w]+)<a/g, '<span>$1</span><a')
           .replace(/<\/a>([^\s\w]+)/g, '</a><span>$1</span>');

$div.html( html );​

编辑:更新为排除与标签相邻的字母数字字符。