SVG参数，例如“xmlns”和“version”，是否必需？

Question

在我看到的一半SVG示例中，代码包含简单的<svg></svg>标签。

在另一半示例中，SVG标签具有许多复杂的属性，例如：

<svg 
  xmlns="http://www.w3.org/2000/svg" 
  version="1.1" 
  xmlns:xlink="http://www.w3.org/1999/xlink"> 

我的问题是：使用简单的SVG标签是否可以？我尝试过使用复杂的标签，但如果不包括它们，我的端口一切正常。

- Lars

Answer 1

xmlns="http://www.w3.org/2000/svg"属性：

• 对于image/svg+xml文件是必需的¹
• 对于内嵌的<svg>是可选的²

xmlns:xlink="http://www.w3.org/1999/xlink"属性：

• 对于带有xlink:属性的image/svg+xml文件是必需的¹
• 对于带有xlink:属性的内嵌<svg>是可选的²

version="1.1"属性：

• 推荐遵守image/svg+xml文件标准³
• 似乎被所有用户代理忽略⁴
• 在SVG 2中已删除⁵

¹ 国际化资源标识符（RFC3987）
² 自HTML5开始
³ 可扩展标记语言（XML）1.0
⁴ 可能一直到发布更高版本为止。
⁵ SVG 2，W3C候选推荐，2018年8月7日

(SVG 2是W3C的候选推荐，发布于2018年8月7日，涉及IT技术相关内容。)

- ncomputers

---

需要使用http，还是也可以使用https？ - JohannesB

@JohannesB 两个协议是兼容的 :D - ncomputers

@JohannesB 是的，这里有一个内联示例 HTTP HTTPS，以及一个带有xlink属性的内联svg文件示例 HTTP HTTPS。 - ncomputers

谢谢，看来Nick Craver也会犯错啊 ;) - JohannesB

不要将XML声明中的version属性(<?xml version...)与<svg>元素的version属性混淆。前者是关于XML标记语言版本的，而后者指定了SVG的版本。回答者在³中引用了XML而不是SVG规范，因此犯了这个错误。我试图进行更正，但一些白痴拒绝了编辑。 - Bachsau

Answer 2

所有用户代理（浏览器）都会忽略版本属性，因此您始终可以删除该属性。

如果您将SVG内联嵌入HTML页面并将该页面作为text/html提供，则不需要xmlns属性。在HTML5的框架下，将SVG内联嵌入HTML文档是一项相当新的创新。

但是，如果您以image/svg+xml、application/xhtml+xml或任何其他会导致用户代理使用XML解析器的MIME类型提供页面，则xmlns属性是必需的。这是直到最近唯一的处理方式，因此有很多这样的内容服务。

- Robert Longson

---

所有用户代理都会忽略版本属性，因此您可以始终省略该属性。但是规范对此有何说明？“浏览器将允许您这样做”曾经适用于许多明显不正确的做法。 - Mark Amery

在IE11中，如果我输入<!DOCTYPE svg xmlns="www.w3.org/2000/svg">它可以工作，但是如果我去掉xmlns或者将其更改为<!DOCTYPE svg xmlns="www.example.com">，它就无法工作了。为什么会这样？ - Donald Duck

@RobertLongson：当您说“xmlns属性”时，是否包括xmlns：xlink？ - SC_Chupacabra

@Marcel 如果那些 data-uri 是 image/svg+xml 格式，通常情况下最后的答案是正确的。 - Robert Longson

@SC_Chupacabra 任何xmlns:属性只是为命名空间声明了一个前缀。如果您不使用前缀，就不需要这些内容。因此，如果您的SVG没有xlink:属性，则是不必要的。就像在每个XML文档中一样。 - ygoe

Answer 3

我想在两个答案的基础上补充一点，但是我没有积分，所以我正在添加一个新的答案。 在最近对Chrome（版本63.0.3239.132（官方版本）（64位Windows））的测试中，我发现：

1. 对于直接输入到HTML文件中的内联SVG，可以通过文本编辑器或Javascript和elm.innerHTML，无需xmlns属性，如其他两个答案所述。
2. 但是对于通过javascript和AJAX加载的内联SVG，有两个选项：
   • 使用xhr.responseText和elm.innerHTML。这不需要xmlns。
   • 使用xhr.responseXML.documentElement和elm.appendChild()或elm.insertBefore()。使用此方法创建内联SVG会产生不完整的结果，因为未声明基本SVG命名空间，例如xmlns =“http://www.w3.org/2000/svg”。<svg>会加载到HTML中，但是文档级函数（如getElementById()）不会被<svg>元素识别。我认为这是因为它在HTML之外使用XMLHttpRequest XML解析器。

- jamess

Answer 4

关于SVG版本属性，MDN的WebDoc表示：

自SVG 2起已弃用
该功能不再建议使用。尽管一些浏览器仍可能支持它，但它可能已经从相关网络标准中删除，正在被删除过程中，或者仅出于兼容性目的而保留。请避免使用它，并尽可能更新现有代码；查看此页面底部的兼容性表格以指导您的决策。请注意，此功能随时可能停止工作。

版本属性用于指示SVG文档符合哪个规范。它仅允许在根元素上使用。它纯粹是建议性的，对呈现或处理没有影响。

附：SVG 2远未成为标准。

- Velusamy Velu

---

注意：上述仅适用于“版本”属性，而不适用于“xmlns”。xmlns 是 XML（而非 SVG）的特性，因此在 HTML5 中（当未用作 XML/XHTML 时）它是不相关或不需要的，但在任何原因嵌入 XML 的 SVG 中，它是必要的。 - thomasrutter