在两组字符之间获取目标字符集

Question

我和我的朋友在线上找到了许多方法，但是它们要么与JavaScript的正则表达式不兼容，要么从不完全针对我们只想针对我们或我们针对的对象

继续重定向到其他令人困惑的帖子，这些帖子最终对其他人建议的代码无济于事，但我是

意识到这里已经有类似的帖子，但是没有一个适合我们。我基本上想做的是我要在两组字符之间获得一组字符。

在这种情况下，例如Invoke-WebRequest和url(之间

我们目前正在此网站上测试表达式和字符串

https://www.regextester.com/

因此，请为该字符串提供正确的表达式，而无需使用花哨的JavaScript附加代码。我们将照顾我们自己的JavaScript附加代码。我们只是有兴趣获取此字符串的有效表达式

);

Answer 1

您可以使用正则表达式/(?<=\().*(?=\))/。

这会在左括号内显示正向外观，在右括号上呈现正向外观，匹配括号之间的任何字符。 可以在 here 中看到。

const string = "style='background-image: url(MATCH TARGET); background-size: cover; background-position: center; background-repeat: no-repeat;'";
const regex = /(?<=\().*(?=\))/;

console.log(string.match(regex)[0]);

Answer 2

您可以使用以下正则表达式：

url\((.*?)\)

说明可以在这里找到：https://regex101.com/r/v3EwJl/1。

JavaScript实现：

/url\((.*?)\)/.exec('background-image: url(MATCH TARGET); background-size: cover; background-position: center; background-repeat: no-repeat;')[1]
//"MATCH TARGET"

Answer 3

我不知道这些“花哨的JavaScript添加代码” 是什么，但是如果您确实确定style属性将始终采用这种格式，则使用正则表达式非常简单：< / p>

background-image: ?url\(([^)]+)\);?

 ? –可选空格（以防您遇到background-image:url(…)之类的东西）

[^)]+ –至少一个不是)的字符

;? –可选的分号，当背景声明位于style的末尾而没有分号（style="…; background-image: url(…)"）时匹配。

使用JS也很容易：

const fooStyle = "style='background-image: url(MATCH TARGET); background-size: cover; background-position: center; background-repeat: no-repeat;'";
const match = myString.match(/background-image: ?url\(([^)]+)\);?/);
console.log(match[1]); // -> MATCH TARGET

如果style属性实际上包含诸如url("MATCH TARGET")或url('MATCH TARGET')之类的内容，您可能希望删除引号以获得实际的URL：

console.log(match[1].replace(/['"]/g, ""))

---

但是...如果您只是想获取页面上某些DOM元素的背景URL（看起来您正在这样做），它可能会更容易且更可靠（see this）使用浏览器API而不是字符串解析来获取实际属性。

让我们说感兴趣的元素是<div class="i-got-a-fancy-background" style="…">…</div>：

const element = document.querySelector(".i-got-a-fancy-background")
const elementStyle = element.currentStyle || window.getComputedStyle(element, false),
const elementStyle = style.backgroundImage.slice(4, -1).replace(/"/g, "");

我相信这很清楚。 .slice(4, -1)部分删除url(和)，而.replace(/"/g, "")删除引号。