javascript - svg:svg 是什么意思？

Question

这是什么意思？

.append("svg:svg")

我在 HTML 和 D3 代码中看到了它。它是否添加了SVG插件？

score 21 · Accepted Answer

在 XHTML 代码中，可以使用名称空间来区分网页中包含的其他基于 XML 的语言。这里，命名空间“svg”在标签“svg”之前使用。

namespace:tagname

这在两个标签（例如，在 XHTML 和 SVG 中）具有相同名称并且您想准确指定您引用的标签的情况下很有用。可以使用xmlns属性指定标签。如您所知，XHTML 文档以

<html xmlns="http://www.w3.org/1999/xhtml">

您可以将前缀指定为

<html xmlns:prefix="http://www.w3.org/1999/xhtml">

然后你会使用

<prefix:head>
    <prefix:title></prefix:title>
</prefix:head>

同样，您可以使用

<svg xmlns="http://www.w3.org/2000/svg">

而不仅仅是<svg>在包含您的 svg 图形时。然后所有 svg 标签都以svgprefix前缀开头。但是，如果您有子 SVG 节点，它们也需要xmlns定义此属性。在这种情况下，定义前缀可能会更容易。

score 16 · Accepted Answer

元素的标签名称可能有一个命名空间前缀，例如“svg:text”以在 SVG 命名空间中创建一个“text”元素。默认情况下，D3 支持 svg、xhtml、xlink、xml 和 xmlns 命名空间。可以通过添加来注册额外的命名空间d3.ns.prefix。

请特别注意，D3.js 中的命名空间前缀不是基于您的文档，而是公共前缀到实际命名空间 URL 的预定义映射。

命名空间是 XML 文档（包括 XHTML但不包括 HTML）可以包含两个具有相同名称的属性或元素的方式（例如，数学正弦计算中的“sin”与道德失败中的“sin”）没有冲突。<svg>除非 SVG 元素位于SVG 命名空间中，否则将元素放入 XHTML 文档中没有任何意义。

有关更多信息，请阅读XML 中的命名空间。

2 回答 2