将 SVG 转换为 Base64 JavaScript

在 Web 开发中，经常使用 SVG 来制作矢量图形。有时候，需要将 SVG 转换为 Base64 JavaScript，以便在 HTML 中嵌入这个图形。本文将介绍如何将 SVG 转换为 Base64 JavaScript。

使用在线工具

有很多在线工具可以将 SVG 转换为 Base64 JavaScript。其中比较受欢迎的是 SVG to Base64。使用该工具非常简单：

1. 将 SVG 代码粘贴到工具的输入框中。
2. 点击“Convert to Base64”按钮，等待转换完成。
3. 复制生成的 Base64 JavaScript 代码，使用时将其嵌入到 HTML 中。

使用在线工具的优点是简单方便，不需要安装任何软件。但是，如果需要转换多个 SVG 文件，每次粘贴 SVG 代码并不是很方便，这时候可以考虑使用转换库。

使用转换库

在 JavaScript 中，可以使用 btoa 函数将二进制数据转为 Base64。因此，将 SVG 转换为 Base64 JavaScript 的方法非常简单：

const svgCode = '<svg ...>'; // SVG 代码
const base64Code = btoa(svgCode); // 将 SVG 代码转为 Base64
const javascriptCode = `data:image/svg+xml;base64,${base64Code}`; // 将 Base64 编码嵌入到 JavaScript 中

上述代码将 SVG 代码转换为 Base64 编码，并将其嵌入到 JavaScript 代码中。其中，data:image/svg+xml;base64,用于指定嵌入的数据类型和编码方式。在 HTML 中使用该代码时，只需要将其作为 src 属性值即可。

使用转换库的优点是可以批量转换 SVG 文件，不需要反复粘贴代码。但是，需要使用 Node.js 或浏览器环境，需要一定的编程经验。

小结

本文介绍了两种将 SVG 转换为 Base64 JavaScript 的方法：使用在线工具和使用转换库。根据自己的需要选择适合的方法即可。无论采用哪种方法，SVG 转换为 Base64 JavaScript 都非常简单。