从 javascript(Internet Explorer 和 Edge)更改后如何重绘 SVG [英] How to redraw SVG after change from javascript (Internet Explorer and Edge)

查看:52
本文介绍了从 javascript(Internet Explorer 和 Edge)更改后如何重绘 SVG的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

有谁知道如何在更改其内容后强制 IE 和 Edge 显示/刷新嵌入的 SVG(请参阅下面的代码)

Does anyone know how to force IE and Edge to display/refresh embedded SVG after changing its content (see code below)

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>Title</title>
        <script type="text/javascript">     
            function onClick() {           
                document.getElementById('svg').innerHTML = '<circle r="50" cx="50" cy="50" fill="red" />';
            }
        </script>
    </head>
    <body>  
        <button type="button" onclick="onClick()" >Display red circle</button>
        <svg id="svg"/>
    </body>
</html>

推荐答案

基本上,您不需要重新加载任何内容.实际上,问题是不同的.您将无法使用标准的 innerHTML 方法与 SVG 交互.调用 innerHTML 后,您的 SVG 不会更新.此方法仅适用于编辑 HTML 元素.

Basically, you do not need to reload anything. Actually, the problem is different. You will not able to interact with SVG using standard innerHTML method. Your SVG is not updated after calling to innerHTML. This method is suitable for editing HTML elements only.

请看一下这个:动态更新SVG

这篇关于从 javascript(Internet Explorer 和 Edge)更改后如何重绘 SVG的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆