Question

在JavaScript中，我有一个包含DOM片段的字符串。我如何找到并替换图像的src属性？

我想用新路径替换所有图像的路径，但保留图像名称。并非所有路径都相同，可以来自不同的位置。我的正规表达能力最差。

例如：

Change

   <img src='path/to/image/name.jpg' />

into 

   <img src='newPath/name.jpg' />

Answer 1

得到了gumbo的答案并添加了一些改进它的东西：

如果输入字符串包含某些内容除了<img>标签之外的其他标签一个src属性 - 这将不再存在匹配/替换它们。
src属性可能是使用单引号或双引号。
测试不区分大小写。

导致：

string.replace(/<img([^>]*)\ssrc=(['"])(?:[^\2\/]*\/)*([^\2]+)\2/gi, "<img$1 src=$2newPath/$3$2");

Answer 2

试试这个：

str.replace(/src='(?:[^'\/]*\/)*([^']+)'/g, "src='newPath/$1'");

Answer 3

如果以字符串形式使用HTML等原始（非DOM）数据，则上述内容与双引号字符不匹配。这段代码也可能有用：

root     = serviceURL("file") + "&src=" + encodeURIComponent(root);
// html itself
html     = html.replace(/src=['"](?:[^"'\/]*\/)*([^'"]+)['"]/g, "src='" + root + "/$1'");

Answer 4

replace(/(.*)\/(.*)/, "newPath/$2");

Answer 5

我在我的项目中使用了这些表达式，像魅力一样工作，处理所有案例，如引用，双引号，文本中的多个图像标签等。在Javascript中

text.replace(/\<img([^>]*)\ssrc=('|")([^>]*)\2\s([^>]*)\/\>/gi, "<img$1 src=$2newPath/$3$2 $4/>");

在PHP中

preg_replace('/\<img([^>]*)\ssrc=(\'|\")([^>]*)\2\s([^>]*)\/\>/', "<img$1 src=$2newPath/$3$2 $4/>",$text);

JavaScript中的正则表达式 - 替换Image src属性

5 个答案: