Question

我想使用正则表达式和javascript提取SVG路径，但它不起作用。

我的SVG文件：

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100" height="100" viewbox="0 0 100 100">
  <path d="M0.675,11.333h98.849v21.182H0.675V11.333z M0.675,39.576h98.849v21.183H0.675V39.576z M0.675,67.818h98.849v21.184H0.675
       V67.818z"/>
</svg>

我的正则表达式：/^<path(.*)\/>$/gm

我想得到这个：<path d="M0.675,11.333h98.849v21.182H0.675V11.333z M0.675,39.576h98.849v21.183H0.675V39.576z M0.675,67.818h98.849v21.184H0.675 V67.818z"/>

我没有结果......

Answer 1

js正则表达式中的点不会与换行符匹配。

var s = '<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100" height="100" viewbox="0 0 100 100">\n<path d="M0.675,11.333h98.849v21.182H0.675V11.333z M0.675,39.576h98.849v21.183H0.675V39.576z M0.675,67.818h98.849v21.184H0.675\nV67.818z"/>\n</svg>';
alert(s.match(/<path\b([\s\S]*?)\/>/g))

[\s\S]*匹配任何字符，包括换行符。

Answer 2

容易！

/^<path(.*?)\/>$/gs

说明：

s标志。使用它代替m标记，将每行视为不同的字符串。
.*? 非贪婪正则表达式

使用正则表达式提取svg路径

2 个答案:

说明：