<svg></svg> 如何保存为一个 .svg

如果你已经编写好了一个 SVG 图像，并且想要将其保存为 .svg 文件，可以使用以下方法：

1. 通过浏览器保存

在浏览器中打开一个空白页面，并将编写好的 SVG 图像代码粘贴到 `<svg>` 标签中，然后右键点击该图像，选择“另存为”或“保存页面”，将其保存为 .svg 文件即可。

2. 使用编辑器保存

如果你正在使用一个文本编辑器，例如 VS Code，Sublime Text 等，可以将编写好的 SVG 图像代码保存为 .svg 文件。具体操作方式为：将代码复制到一个新的文本文件中，然后将该文件保存为 .svg 后缀的文件即可。

无论使用哪种方法，保存 SVG 文件时需要注意以下几点：

- 确保文件后缀为 .svg
- 确保图像的 viewBox 属性正确设置
- 如果使用了外部图片资源，需要将这些资源一并保存在同一目录下，或者将其 base64 编码后嵌入到 SVG 文件中

相关问题

html img标签上显示<svg></svg>

如果您在HTML的<img>标签中使用<svg>标签，SVG代码将不会被解释为图像，而是会被视为无效的图像源。因此，您将看到一个空框。如果您想在<img>标签中显示SVG图像，您需要将SVG代码嵌入到HTML文档中，或者使用<iframe>标签将SVG文件作为单独的文档引用。或者，您可以将SVG代码转换为PNG或JPEG图像格式，然后在<img>标签中使用该图像的URL。

怎么在<div id = "chain-graph"> </div>里面找到<svg></svg>的内容

可以使用JavaScript来获取`<div id="chain-graph">`元素中的`<svg>`元素内容。可以使用`document.getElementById()`方法获取到`<div>`元素，然后使用`innerHTML`属性获取`<div>`元素中的HTML内容，最后使用正则表达式匹配出`<svg>`元素的内容。

以下是一个示例代码：

// 获取<div>元素
var divElement = document.getElementById("chain-graph");

// 获取<div>元素中的HTML内容
var htmlContent = divElement.innerHTML;

// 使用正则表达式匹配<svg>元素的内容
var regex = /<svg.*?>[\s\S]*?<\/svg>/i;
var svgContent = htmlContent.match(regex)[0];

console.log(svgContent); // 输出<svg>元素的内容

需要注意的是，这种方式获取的`<svg>`元素内容是包括其父元素`<div>`在内的完整HTML代码。如果只需要获取`<svg>`元素的内容，可以通过修改正则表达式来实现。