Question

我在HTML中嵌入了内嵌SVG，如下所示：

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:myapp2="http://example.org/myapp2" height="200px" width="200px">
    <rect id="myRect" height="100px" width="100px" fill="blue" myapp2:height="200px" xlink:href="ok"/>
    <myapp:piechart xmlns:myapp="http://example.org/myapp"
    title="Sales by Region">
        <myapp:pieslice label="Northern Region" value="1.23"/>
    </myapp:piechart>
</svg>
<script>
var rect = document.getElementById("myRect");
var rectHeight = rect.getAttribute('height'); // returns 100px
var rectHref = rect.getAttributeNS('http://www.w3.org/1999/xlink', 'href'); // returns ok
var rectMyApp2Height = rect.getAttributeNS('http://example.org/myapp2', 'height'); // returns null
var rectPiechartLen = rect.getElementsByTagNameNS('http://example.org/myapp', 'piechart').length; // returns 0
</script>

我无法从自定义命名空间myapp和myapp2中读取节点的值。为什么rectMyApp2Height的值为null？为什么rectPiechartLen的值是0？

Answer 1

html5不支持自定义命名空间，只支持svg，mathml和xml。

您需要使用某些xml mime类型来提供文档，例如text / xml以支持命名空间。

如何在HTML5中的Inline SVG中读取自定义命名空间节点？

1 个答案: