批量处理 Html img 标签，给 img 标签包裹一个 <a href="${url}"> 标签，用来实现“查看大图”的功能

在博客园写文章时，经常要上传图片，而有时候上传的图片是数码照片，尺寸（分辨率）很大。而这时需要在上传完所有的图片后，批量给这些图片增加一个“查看大图”的功能，也就是 Html 代码中给 img 标签包裹一个 a 标签，这个 a 标签的 href 指向 img 的 src 值。

在博客园上传完所有图片后，点击编辑器里面的“编辑HTML源代码”按钮，

比如：

<p>请看如下图片</p>
<p>IMG-01：</p>
<p><img src="http://pic002.cnblogs.com/images/2012/111111/2012102222273010.png" alt="" /></p>
<p>IMG-02：</p>
<p><img src="http://pic002.cnblogs.com/images/2012/111111/2012102222281511.png" alt="" /></p>
<p>IMG-03：</p>
<p><img src="http://pic002.cnblogs.com/images/2012/111111/2012102222285412.png" alt="" /></p>
<p>IMG-04：</p>
<p><img src="http://pic002.cnblogs.com/images/2012/111111/2012102222292513.png" alt="" /></p>
<p>等等，下面可能还有很多、很多图片...</p>
<p>上传完毕！</p>

而按照本文下面说的，需要给这些 img 标签包裹一个 a 标签，a 标签的 href 指向 img 的 src 值。由于图片可能会很多，不可能手工一个一个的加，那么我们需要一个正则表达式工具来替换，比如 VS 自带的搜索与替换，就能满足这个功能，主要是写正则表达式。

我写的正则表达式如下：

Regex: <img\s*src="(?<url>.*?)" alt="" />

Replace: <a href="${url}" target="_blank"><img src="${url}" width="100%" alt="点击看大图" title="点击看大图" /></a>

替换后的 HTML 代码为：

<p>请看如下图片</p>
<p>IMG-01：</p>
<p><a href="http://pic002.cnblogs.com/images/2012/111111/2012102222273010.png" target="_blank"><img  src="http://pic002.cnblogs.com/images/2012/111111/2012102222273010.png" width="100%" alt="点击看大图" title="点击看大图" /></p>
<p>IMG-02：</p>
<p><a href="http://pic002.cnblogs.com/images/2012/111111/2012102222281511.png" target="_blank"><img  src="http://pic002.cnblogs.com/images/2012/111111/2012102222281511.png" width="100%" alt="点击看大图" title="点击看大图" /></p>
<p>IMG-03：</p>
<p><a href="http://pic002.cnblogs.com/images/2012/111111/2012102222285412.png" target="_blank"><img  src="http://pic002.cnblogs.com/images/2012/111111/2012102222285412.png" width="100%" alt="点击看大图" title="点击看大图" /></p>
<p>IMG-04：</p>
<p><a href="http://pic002.cnblogs.com/images/2012/111111/2012102222292513.png" target="_blank"><img  src="http://pic002.cnblogs.com/images/2012/111111/2012102222292513.png" width="100%" alt="点击看大图" title="点击看大图" /></p>
<p>等等，下面可能还有很多、很多图片...</p>
<p>上传完毕！</p>

软件效果图如下：



工具 RegexTester 下载：http://files.cnblogs.com/Music/RegexTester.zip

谢谢浏览！