从图像脚本中剥离高度和宽度属性的正则表达式答案

【问题标题】：Regular expression for stripping height & width attributes from image scripts从图像脚本中剥离高度和宽度属性的正则表达式
【发布时间】：2014-03-25 21:52:02
【问题描述】：

我正在重新设计我的所有网页，以便它们可以在移动设备中显示（响应式设计）。因此，我需要从所有图像脚本中去除宽度和高度属性。

但不是简单地删除宽度和高度属性，我想在图像脚本之后附加它们，如下面的第二个示例所示。如果我知道图片的默认大小，处理图片会容易得多。

<img class="Animals" src="/images/Animals/Horse.jpg" width="300" height="212" alt="Horse">

<img class="Animals" src="/images/Animals/Horse.jpg" alt="Horse"><!--300X212-->

我正在使用 PHP，可以使用 Dreamweaver 或 TextWrangler 进行搜索和替换操作。

【问题讨论】：

This is trickier than you might think.

标签： html regex

【解决方案1】：

这应该在 PHP 中完成...

<?php
$html = '<img class="Animals" src="/images/Animals/Horse.jpg" width="300" height="212" alt="Horse">';
echo preg_replace('/(<.+) width="(\d+)" height="(\d+)"(.+)/','$1$4<!--$2x$3-->', $html);
?>

正则表达式由这张图解释：

【讨论】：

【解决方案2】：

我不认识你的编辑器，所以无法测试，但你可以试试这个模式；

查找

\swidth="(\d+)"\sheight="(\d+)"( alt="\w+")>

替换

$3><!--$1x$2-->

顺便说一句，如果你想学习正则表达式，你可以试试这个网站，里面有一些不错的教程； http://regexone.com/

【讨论】：

@Serkan - 谢谢，但这在 Dreamweaver 或 TextWrangler 中都不起作用。（也许我需要换一个编辑器。）
我正在尝试使用 Notepad++ 和 Visual Studio，两者都适用。
@DavidBlomstrom 在 TextWrangler 中，你可以尝试用这个替换部分吗？ \3>
谢谢，Serkan，但问题出在第一行——它找不到那个模式。我应该提到我正在使用Mac。我尝试下载 Notepad++，但发现它只适用于 Windows。 ;)
@DavidBlomstrom 好吧，那会很方便。不幸的是，我正在检查 Dreamweaver 和 TextWrangler 的正则表达式选项，但无法确定问题所在。