我是否可以在使用JavaScript

时间:2017-01-24 09:14:27

标签: javascript svg innerhtml inline-svg

我想在我的HTML中附加一个SVG图像,并让SVG中的JavaScript执行。

让我们说我想提取this image并将其放入我的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>

Fiddle

SVG映像的脚本标记中包含console.log()和alert()。这些在查看图像时执行得很好,但在通过JavaScript将图像附加到HTML时则不行。有没有办法做到这一点并让JavaScript执行?

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

1 个答案:

答案 0 :(得分: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");
});