可以't通过其ID访问SVG

Can't access SVG by its ID

本文关键字：ID 访问 SVG 可以      更新时间：2024-04-30

我想在加载文件后访问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 
}):

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

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

相关文章：