javascript - 将路径坐标获取到我的 JavaScript 文件中

Question

我使用 Inkscape 创建了一个路径，我可以使用 getElementByID 之类的方法将 SVG 文件中的坐标(路径)获取到我的 JavaScript 文件中吗？在下面发布了路径的代码。我也在使用 SNAP.svg 如果可以的话请留下您的答案，谢谢!我想将 d="m 110.36905......."从 svg 文件中取出到我的 javascript 文件中

<path
         inkscape:original-d="m 110.36905,95.916669 v 52.160711 h 92.98214 v 40.06548"
         inkscape:path-effect="#path-effect821"
         inkscape:connector-curvature="0"
         id="L_PUF_AKL"
         d="m 110.36905,95.916669 c 0,11.243311 -0.0171,30.565001 -0.0389,52.160711 0,-3.5e-4 -4e-5,0.0393 -4e-5,0.0389 -0.006,0 0.0452,3e-5 0.039,2e-5 30.13329,0.0171 62.75026,0.0372 92.88868,0.0543 -0.0218,16.55036 -0.0388,31.35222 -0.0388,39.9722 0,0 0.13229,0 0.13229,0 0,0 0.13229,0 0.13229,0 0,-8.63617 -0.0171,-23.47747 -0.0389,-40.06548 0,5e-5 -1.3e-4,-0.0934 -1.3e-4,-0.0934 -0.001,0 -0.0917,5e-5 -0.0932,5e-5 -30.15147,0.0171 -62.78962,0.0372 -92.94323,0.0544 -0.0219,-21.57998 -0.0389,-40.88518 -0.0389,-52.121731 z"
         style="fill:#000000;fill-rule:nonzero;stroke:#000000;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;fill-opacity:1;stroke-miterlimit:4;stroke-dasharray:none" />

Answer 1

您可以尝试创建一个 svg 元素，将路径作为 innerHTML 插入其中并检索其 d 属性。

const svg = document.createElement("svg");
svg.innerHTML = `<path
   inkscape:original-d="m 110.36905,95.916669 v 52.160711 h 92.98214 v 40.06548"
   inkscape:path-effect="#path-effect821"
   inkscape:connector-curvature="0"
   id="L_PUF_AKL"
   d="m 110.36905,95.916669 c 0,11.243311 -0.0171,30.565001 -0.0389,52.160711 0,-3.5e-4 -4e-5,0.0393 -4e-5,0.0389 -0.006,0 0.0452,3e-5 0.039,2e-5 30.13329,0.0171 62.75026,0.0372 92.88868,0.0543 -0.0218,16.55036 -0.0388,31.35222 -0.0388,39.9722 0,0 0.13229,0 0.13229,0 0,0 0.13229,0 0.13229,0 0,-8.63617 -0.0171,-23.47747 -0.0389,-40.06548 0,5e-5 -1.3e-4,-0.0934 -1.3e-4,-0.0934 -0.001,0 -0.0917,5e-5 -0.0932,5e-5 -30.15147,0.0171 -62.78962,0.0372 -92.94323,0.0544 -0.0219,-21.57998 -0.0389,-40.88518 -0.0389,-52.121731 z"
   style="fill:#000000;fill-rule:nonzero;stroke:#000000;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;fill-opacity:1;stroke-miterlimit:4;stroke-dasharray:none" 
/>`;
console.log(svg.querySelector("path").getAttribute("d"));