Question

我想在加载文件以供交互使用后访问svg及其路径的id。我用一个函数加载SVG并将节点导入DOM。在 document.ready 和 document.addEventListener（“DOMContentLoaded”，function（event）中都没有我能够通过其id获取元素。获取它的唯一方法是围绕交互式代码设置超时。

我想要的是SVG（900kb）及其DOM应该在加载所有其他代码之前加载。但到目前为止，我找不到一个合适的解决方案。

我很困惑，因为如果我在浏览器中使用firebug查看DOM，我能够看到带有ID的div但我无法得到它....而且我无法在我的代码中找到问题，因为我加载它在DOM中并在DOM准备好后访问它？谁在这里找到解决方案？

这是加载svg的代码：

function fetchXML  (url, callback) {
        var xhr = new XMLHttpRequest();
        xhr.open('GET', url, true);
        xhr.onreadystatechange = function (evt) {

        if (xhr.readyState === 4) {
            callback(xhr.responseXML);          
        }

        };
        xhr.send(null);
    };

    fetchXML("svg/bez_grey.svg",function(newSVGDoc){
        var n = document.importNode(newSVGDoc.documentElement,true);
        var mysvg = document.getElementById("map"); 

        mysvg.appendChild(n);

    })  

document.addEventListener("DOMContentLoaded", function(event) {

// Access the SVG-Elements here 

}):

Answer 1

在致电document.documentElement.appendChild(n);之前，您需要致电var mysvg = document.getElementById("map");。这会将n加载到document的DOM中。您可以删除语句mysvg.appendChild(n);

此解决方案基于此处的工作代码示例：https://stackoverflow.com/a/3378320

无法通过其ID访问SVG

1 个答案: