在svg上动态添加“设置”标签以更改属性

时间:2019-05-29 16:16:38

标签: javascript css svg

我想在svg上使用“设置”属性将其显示属性动态更改为“隐藏”。
当我尝试在javascript中执行此操作时,它不起作用,但是当我手动添加相同的set标签时,它可以工作。 关于如何进行这项工作的任何想法吗?
谢谢。

<!DOCTYPE html>

<html>

<head>
</head>

<body>

    <svg>

        <rect id="rect" x="0" y="0" width="200" height="100" style="fill :pink ; visibility: visible">
                <!--set attributeName="visibility" attributeType ="CSS"  to="hidden"    begin="0" dur="2s"/-->
        </rect>

        <script>
            var rectangle = document.getElementById("rect")

            var settag = document.createElement("set")
            settag.setAttributeNS(null, "attributeName", "hidden")
            settag.setAttributeNS(null, "attributeType", "CSS")
            settag.setAttribute("to", "visible")
            settag.setAttribute("begin", "0")
            settag.setAttribute('dur', "5s")

            rectangle.appendChild(settag)
        </script>
    </svg>

</body>

</html>

0 个答案:

没有答案