Question

在包含SVG图像作为对象的页面中，我们可以按ID（ How to access SVG elements with Javascript ）处理各个元素：

<object data="myimage.svg" type="image/svg+xml" id="alphasvg"></object>
<script>
    var a = document.getElementById("alphasvg");
    a.addEventListener("load", function () {
        var svgDoc = a.contentDocument; //get the inner DOM of alpha.svg
        var delta = svgDoc.getElementById("myelement"); //get the inner element by id

        delta.addEventListener("mousedown", function () { alert('hello World!') }, false);    //add behaviour
    }, false);
</script>

但使用svgDoc.getElementById("mygroupelement")按ID引用组元素不起作用。

<svg ...>
<path id = "myelement" ...>
<g id="mygroupelement" ...> <.. various path/polyline/etc elements..> </g>
</svg>

那么如何引用SVG中的组元素？

（另请参阅 How to get an SVG(+XML) image to interact with the page it is in ，其中交互是从另一个方向 - 从元素到页面。）

如何从包含它的页面与SVG组进行交互？

0 个答案: