将网页中引入的 svg 转换为代码
问题：
在网页中引入了一个 SVG 文件，但是源代码中只显示一个简单的 SVG 文件路径 (例如，./test.svg)，而其他网站的 SVG 引入通常是一大串编码。如何实现这种编码引入方式？
答案：
可以使用 JavaScript 的 fetch 和 DOMParser API 来实现：
代码：
// 取代你想获取SVG的文件地址fetch('https://static.segmentfault.com/main_site_next/614d2165/_next/static/media/sf-icon-small.4d244289.svg') .then(body => body.text()) .then(svg => (new DOMParser).parseFromString(svg, 'image/svg+xml')) .then(actualSVG => { // 将实际的SVG添加到页面中 document.querySelector('#test').appendChild(actualSVG.documentElement) });
登录后复制
使用说明：
将代码中的 SVG 文件 URL 替换为你自己的 URL。将 #test 替换为你希望插入 SVG 的元素 ID。
通过这种方法，你可以从网页中获取 SVG 的实际编码，并将其动态添加到你的代码中。
以上就是如何将网页中引入的 SVG 文件转换为代码？的详细内容，更多请关注【创想鸟】其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至253000106@qq.com举报，一经查实，本站将立刻删除。
发布者：PHP中文网，转转请注明出处：https://www.chuangxiangniao.com/p/2805571.html
