如何在JavaScript中使用正则表达式替换部分文本？

debugcn 发表于 Dev

用户名

我正在从数据库中获取HTML内容并在UI中显示。如果显示的内容包含指定了宽度和高度的图像，那么在UI中显示时，我需要将图像的宽度和高度替换为某个固定值。

一个示例内容如下：

<p>
   Sample paragraph text. 
   <br />
   <img src="http://www.example.com/myimage.jpg?width=500&height=500" 
    title="Test Image" />
   Sample text.
   <br />
</p>

在这里，我想将图像宽度设置为300，并针对不同图像动态删除高度。

我尝试使用正则表达式替换文本，如下所示：

.replace(new RegExp("width=([^&]{0,})", 'gi'), 'width=300') 
.replace(new RegExp("[?&]height=([^&]{0,})", 'gi'), '')

但结果如下：

<p>Sample paragraph text. <br /> <img src="http://www.example.com/myimage.jpg?width=300

它替换？width = 300之后的所有文本。

我想要这样的结果： <p>Sample paragraph text. <br /> <img src="http://www.example.com/myimage.jpg?width=300" title="Test Image" /> Sample text.<br /></p>

因此，我想问题出在正则表达式中。请帮助我纠正此问题。

在此先谢谢了！

马特

这种模式：/[^&]{0,}/吞噬了不是＆字符的所有内容，这就是为什么它超出了URL本身的原因。相反，由于您知道宽度和高度是数字，因此可以按数字进行匹配：

.replace(/\bwidth=\d*/gi,'width=300')
.replace(/&height=\d*|\bheight=\d*&?/gi,'');

该\b是零宽度匹配一个单词边界，所以，如果你有framewidth = 500例如，它不会受到影响。高度的2个匹配项是，因此如果它们在每一侧都不会替换两个＆项。例如，您不希望将'？width = 500＆height = 500＆cache = 123'转换为'？width = 300cache = 123'。

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。