是否可以使用JavaScript获取SVG图像的XML？

Question

我的目标是在JavaScript中加载SVG图像,并将其作为图像和底层SVG XML.

我可以加载像...

var myImage = new Image();
myImage.src = "cat.svg";

现在有了图像后,如何访问组成SVG图像的基础XML？

我提出的唯一解决方案是通过ajax再次加载它:

$(myImage).one("load", function(){
    $.ajax({
        url :       "cat.svg",
        cache :     true, 
        dataType :  "xml"
    }).fail(function( jqXHR, textStatus, errorThrown ) {
        console.error("Ajax failure loading image.");
    }).done(function( data, textStatus, jqXHR ){
        console.log("Got the image's SVG XML:", $(data).find('svg'));
    });
});

但我觉得可能有更好的方法来做到这一点.

Answer 1

无法从Image对象中提取图像源.

您的问题中包含的AJAX解决方案是获取源的唯一方法.

如果您只想加载一次图像,那么也许您可以先使用AJAX 获取它,然后使用获取的XML渲染图像(例如,将文档添加为内联SVG,或将源设置为data:或Blob URL) .