用于匹配 css 图像 url 但不匹配数据 url 的 Javascript 正则表达式

标签 javascript css regex shopify

我使用以下 javascript 正则表达式来定位我的 css 中的图像 url,并将它们包装在液体标签中(用于 Shopify 主题):

text.replace(/url\(()(.+?)\1\)/g, "url({{'$2' | asset_url}})");

这将改变这一点:

url(example.jpg)

为此:

url({{'example.jpg' | asset_url}})

这工作正常,但我的 css 还包含我不想定位的数据 url。例如

url("data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3C!DOCTYPE%20svg%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20SVG%201.1%2F%2FEN%22%20%22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3Csvg%20version%3D%221.1%22%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20%20width%3D%2212px%22%20height%3D%2216px%22%20viewBox%3D%220%200%2012%2016%22%20enable-background%3D%22new%200%200%2012%2016%22%20xml%3Aspace%3D%22preserve%22%3E%3Cg%3E%20%3Cg%3E%20%20%3Cg%3E%20%20%20%3Cg%3E%20%20%20%20%3Cpolygon%20fill%3D%22%2300ABA8%22%20points%3D%229.8%2C15.3%2011.1%2C13.7%204.1%2C8%2011.1%2C2.3%209.8%2C0.7%200.9%2C8%20%20%20%20%20%22%2F%3E%20%20%20%3C%2Fg%3E%20%20%3C%2Fg%3E%20%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E")

我需要如何修改我的正则表达式以排除上述示例中的数据 URL?

最佳答案

尝试使用这个正则表达式

/url\(.*?(gif|png|jpg|jpeg)\'\)/ig

关于用于匹配 css 图像 url 但不匹配数据 url 的 Javascript 正则表达式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24203078/

相关文章:

JavaScript JSON 组合和数据 Anylish

javascript - 使用正则表达式掩码实时控制浮点输入

javascript - 如何将括号参数与正则表达式匹配?

javascript - 高度为 100% 的主体,背景图像为 : cover to fill enire page not just a viewport - without js if possible

javascript - VBA 抓取 JavaScript 生成的内容

html - 我如何在 Firefox 和 IE 中呈现相同的 html/css

html - 如何将边框半径放在按钮的特定 Angular 上

css - 适用于高分辨率和小屏幕手机的响应式设计

regex - Clojure 中的转义括号

javascript - 从主题覆盖 .Mui-disabled(或其他伪类/状态)(MUI v4.1.X)