我的 RegEx Match 做错了什么？

Question

我正在尝试即时替换 css 文件中的 url 内容。

我的目标是：

在任何之前插入一个字符串（路径，即：'/testing/sub/path/'）我遇到的有效文件。
我想确保在第一个引号或双引号之后插入路径（如果存在）。
如果有非文件（例如）data:，我希望跳过它。
如果有以“../”或“/”开头的路径，我想忽略它。

我正在使用 PHP 和 preg_replace()

这是我的正则表达式：/(url\()(['"a-zA-Z0-9].*)(\))/g

您可以在下图中看到我正在尝试的确切测试。由于不太了解正则表达式，它实际上是在选择其中包含我不想要的数据的字符串。这是我最后一次尝试，完全搞砸了：/(url\()(['\"\W][^data\:image]['"a-zA-Z0-9].*)(\))/g

我可以找出实际的替换字符串，它只是让我感到困惑的初始匹配。

这是我的测试数据：（无效css，仅用于预测试）

.grab-cursor {
    cursor:url(grab.png) 8 8, move; 
}

.grabbing-cursor{ 
    cursor:url(grabbing.png) 8 8, move;
    cursor:url("grabbing.png") 8 8, move;
    cursor:url("data.png") 8 8, move;
    cursor:url(data.png) 8 8, move;
    cursor:url('data.png') 8 8, move;
    cursor:url('grabbing.png') 8 8, move;
}
    background-image: url(video-ico.png);
    background-repeat: no-repeat;
    background-position: center center;

background: url(data:image/svg+xml,%3Csvg%20version=%221.1%22%20xmlns=%22http://www.w3.org/)
background: url("data:image/svg+xml,%3Csvg%20version=%221.1%22%20xmlns=%22http://www.w3.org/")
background: url('data:image/svg+xml,%3Csvg%20version=%221.1%22%20xmlns=%22http://www.w3.org/')
/*  background: url("data:image/svg+xml,%3Csvg%20version=%221.1%22%20xmlns=%22http://www.w3.org/2000/svg%22%20xmlns:xlink=%22http://www.w3.org/1999/xlink%22%20x=%220px%22%20y=%220px%22%09%20width=%22512px%22%20height=%22512px%22%20viewBox=%220%200%20512%20512%22%20enable-background=%22new%200%200%20512%20512%22%20xml:space=%22preserve%22%3E%3Cpath%20fill=%22white%22%20d=%22M256,92.481c44.433,0,86.18,17.068,117.553,48.064C404.794,171.411,422,212.413,422,255.999%09s-17.206,84.588-48.448,115.455c-31.372,30.994-73.12,48.064-117.552,48.064s-86.179-17.07-117.552-48.064%09C107.206,340.587,90,299.585,90,255.999s17.206-84.588,48.448-115.453C169.821,109.55,211.568,92.481,256,92.481%20M256,52.481%09c-113.771,0-206,91.117-206,203.518c0,112.398,92.229,203.52,206,203.52c113.772,0,206-91.121,206-203.52%09C462,143.599,369.772,52.481,256,52.481L256,52.481z%20M206.544,357.161V159.833l160.919,98.666L206.544,357.161z%22/%3E%3C/svg%3E") no-repeat center center; */
    background: url("data:image/svg+xml,%3Csvg%20version=%221.1%22%20xmlns=%22http://www.w3.org/2000/svg%22%20xmlns:xlink=%22http://www.w3.org/1999/xlink%22%20x=%220px%22%20y=%220px%22%09%20width=%22512px%22%20height=%22512px%22%20viewBox=%220%200%20512%20512%22%20enable-background=%22new%200%200%20512%20512%22%20xml:space=%22preserve%22%3E%3Cpath%20fill=%22white%22%20d=%22M243.391,166.834l215.748-42.766l-0.145-0.727L444.558,50.5l-363.4,72.035%09C63.07,126.12,50,141.985,50,160.424c0,16.312,0,242.407,0,242.407c0,32.351,26.318,58.669,58.668,58.669h294.664%09c32.35,0,58.668-26.318,58.668-58.669V167.575v-0.741H243.391z%20M422,402.831c0,10.294-8.374,18.669-18.668,18.669H108.668%09C98.374,421.5,90,413.125,90,402.831V261.765h332V402.831z%20M339.528,186.834l-34.931,34.931h-52.426l34.931-34.931H339.528z%09%20M395.225,80.668l41.139,27.529l-51.396,10.214l-41.17-27.55L395.225,80.668z%20M293.981,100.736l41.199,27.568l-51.394,10.213%09l-41.229-27.588L293.981,100.736z%20M192.625,120.827l41.257,27.608l-51.395,10.213L141.2,131.021L192.625,120.827z%20M183.77,186.834%09h52.426l-34.931,34.931h-52.426L183.77,186.834z%20M355.385,221.765l34.931-34.931h52.426l-34.931,34.931H355.385z%20M232.923,393.31%09V284.553l88.693,54.38L232.923,393.31z%22/%3E%3C/svg%3E") no-repeat center center;
    background-size: 80px 80px;
    opacity: 0.9;

Answer 1

我不确定，但我认为你需要 lookahead

您的 [^data:image] 无法工作，因为它正在搜索个别标志。

也许你可以试试这个：（它并不完美，也许对你的情况有帮助）

(url\()((?!"data:image|'data:image|data:image).*)(\))

(?=exp) 是先行搜索并搜索给定的字符串 (?!exp) 相反。但是您可以在上面给定的 link 中阅读更多内容。

我将您的 ['"a-z...] 更改为 .* 它现在搜索任何 char

希望对您有所帮助。

Answer 2

嗯，你可以试试这个。

(url\()((['"]{0,1})[a-zA-Z0-9-]+.[a-zA-Z]+)(\))

Demo

这将匹配 url() url('') 或 url("") 中以文件扩展名结尾的所有内容。这里我只匹配没有数字的情况。如果您需要扩展名中有数字的文件，只需将模式 [a-zA-Z] 更改为 [a-zA-Z0-9]。这可能不是最好的解决方案，但可以很好地处理您的测试数据。

如果您需要进一步的帮助，请更新问题。

我的 RegEx Match 做错了什么？

What am I doing wrong for my RegEx Match?

php

regex

preg-replace