javascript - 删除或隐藏 svg 元素

Question

是否可以使用 css 或 jquery 删除或隐藏 svg 元素。 我知道如何使用 css 来“编辑”div 元素。像这样:

div[style="position: absolute; cursor: pointer; width: 207px; height: 95px; left: 513px; top: 0px; -webkit-transform-origin: 100% 0%;"] {
    display: none !important;
    }

我很好奇是否可以使用 svg 实现类似的功能。 svg 的代码示例

<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 207 95" xml:space="preserve" height="95px" viewBox="0 0 207 95" width="207px" version="1.1" y="0px" x="0px">

谢谢

Answer 1

使用 SVG visibility 属性。

https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/visibility

The visibility attribute lets you control the visibility of graphical elements. With a value of hidden or collapse the current graphics element is invisible

---

[更新]

但是 display: none; 和 opacity: 0 也可以。

但是要知道 opacity ( MDN Link ) 是计算成本最高的(因为它使元素的点击事件保持事件状态，即使元素没有在视觉上显示)，

然后可见性,

然后显示，https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/display .

但是急于使用 display 并不总是最好的，因为我们可以更好地控制具有 visibility 的元素(即，“如果您试图隐藏整个组，除了该组的一个特定成员外，使用“可见性”，因为它在继承中是可覆盖的。” link )

SVG Resource