Question

我正在尝试使用javascript解析和修改一些html（作为字符串），在这个html中，有文件名的引用（如img src或css背景），其中包含句号/句点/点/。 p>

e.g。

<img src="../images/filename.01.png"> <img src="../images/filename.02.png">
<div style="background:url(../images/file.name.with.more.dots.gif)">

我已经尝试过，挣扎并且未能提出一个整洁的正则表达式，允许我解析这个字符串并将其吐出来而没有这些文件名中的点，例如。

<img src="../images/filename01.png"/> <img src="../images/filename02.png"/>
<div style="background:url(../images/filenamewithmoredots.gif)">

我只想影响图像文件名，显然我想单独保留文件类型。

像这样的正则表达式：

/(.*)(?=(.gif|.png|.jpg|.jpeg))

允许我单独匹配文件名的主要部分和扩展名，但它也匹配整个字符串，而不是在我想要的一个文件名中。

我无法控制传入的HTML，我只是在消耗它。

请帮助我溢出，你是我唯一的希望！

Answer 1

考虑使用DOM而不是正则表达式。一种方法是创建假元素。

var fake = document.createElement('div');
fake.innerHTML = incomingHTML: // Not really part of JS standard but all the 'main' browsers support it
var background = fake.childNodes[0].style.background;
// Now use a regex if need be: /url\(\"?(.*)\"?\)/

// If img is at childNodes[1]
var url = fake.childNodes[1].src;

使用jQuery，这更容易：

 $(incomingHTML).find('img').each(function() { $(this).attr('src'); });

Answer 2

我同意这不是一个适合正则表达的问题，更不用说一个整齐的表达了。

但我相信你不是在这里听到的。所以，如果你想把输入保持为字符串......

var src, result = '<img src="../images/filename.01.png"> <img src="../images/filename.02.png"><div style="background:url(../images/file.name.with.more.dots.gif)">';
do {
  src = result;  
  result = src.replace( /((?:url(\()|href=|src=)['"]?(?:[^'"\/]*\/)*[^'"\/]*)\.(?=[^\.'")]*\.(?:gif|png|jpe?g)['")>}\s])/g, '$1' );
} while (result != src)

基本上它一直在删除图像url的文件名的第二个最后一个点，直到没有。以下是表达式的细分，以防您需要修改它。轻轻一点：

(启动主要捕获组，因为js regx没有后顾之忧。
- (?:url(\()|href=|src=)['"]?网址的开头。强制url（）被正确引用会更安全，这样我们就可以使用back引用，但不幸的是你的例子不是。
- (?:[^'"\/]*\/)*网址的文件夹部分。
- [^'"\/]*第二个最后一个点之前的部分文件名。
)关闭主要群组。
\.这是我们想要摆脱的第二个最后一点。
(?=向后看。
- [^\.'")]*文件名的一部分，位于倒数第二个点和最后一个点之间。
- \.(?:gif|png|jpe?g)确保网址以图片扩展名结尾。
- ['")>}\s]关闭网址，可以是引号，'）'，'＆gt;'，'}'或空格。如果可能，用户应该在此处参考。（第一次回答时['"]?\b）
)看完后面。

Answer 3

你的问题是.*中的贪婪匹配。也许最好尝试这样的事情

([^\/]*)(?=(.gif|.png|.jpg|.jpeg))

[^\/]是一个匹配每个字符的字符类，但是斜杠

另一点是，你需要逃避.以便按字面意思匹配

([^\/]*)(?=\.(gif|png|jpg|jpeg))

Answer 4

问题是.表示“任何角色”。

逃脱：

/(.*)(?=(\.gif|\.png|\.jpg|\.jpeg))

Javascript字符串替换文件名中的点（。）

4 个答案: