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

Extract svg path with regex

本文关键字：svg 路径 提取 正则表达式      更新时间：2023-09-26

我想使用正则表达式和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"/>

而且我没有得到任何结果...

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]*匹配任何字符，包括换行符。

简单！

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

解释：

  1. s多行文本的标志。使用它而不是将每行视为不同字符串m标志。
  2. 非贪婪正则表达式的.*?
相关文章：