0

我想将 SVG 图像附加到我的 HTML 并让 SVG 中的 JavaScript 执行。

假设我想获取这张图片并将其放入我的 HTML 中，如下所示：

<!DOCTYPE html>
<html>

<head>
    <title>Test SVG</title>
    <script type="text/javascript">
        var listener = function(response) {
            document.getElementById('output').innerHTML = this.responseText;
        };
        var request = new XMLHttpRequest();
        request.addEventListener('load', listener);
        request.open('GET', 'https://cdn.rawgit.com/jormaturkenburg/42bf377e390839b6fd75745403fface7/raw/4c851457ae03f0b416d122b7538bc6d9dc794954/circle.svg');
        request.send();
    </script>
</head>
<body>
    <div>Hello world!</div>
    <div id="output">
        Inner HTML
    </div>
</body>
</html>

小提琴

SVG 图像的脚本标签中有一个 console.log() 和一个 alert()。这些在查看图像时执行得很好，但在通过 JavaScript 将图像附加到 HTML 时就不行了。有没有办法做到这一点并让 JavaScript 执行？

我知道如果我要嵌入图像它们会执行，但我需要用 JavaScript 内联它。

4

1 回答 1

0 
<body>    
<object id="svgholder" data="some.svg" type="image/svg+xml""></object>
</body>


var svgholder = $('body').find("object#svgholder");

svgholder.load("image/svg+xml", function() {
    alert("some svg loaded");
});
于 2017-01-24T09:20:26.640 回答