如何更改 snap.svg 中的文本

Question

我用线条和文字在网站上画了一幅画。我使用 snap.svg en JQuery.

s为绘图面，g为id为"g54"的组。

g.add(s.text(120, 120, "outside").attr({    "font-size": "15px" }));

我想更改文本，我尝试了几种方法。我可以更改文本的位置、颜色，但不能更改文本本身。

$("#g54 text").attr({ x: 800, y: 700});
$("#g54 text").attr({ stroke: "red" });
$("#g54 text").attr({ text: "test", x: 800, y: 700 });//text doesn't work
$("#g54 text").attr({ innerHTML: "test" });   //innerHTML doesn't work
$("#g54 text").attr({ "innerHTML": "test" });   //innerHTML doesn't work

Answer 1

在 Snap 中，文本属性应该有效。

var t = s.text(120, 120, "outside").attr({ "font-size": "15px" })
g.add(t)
t.attr("text","changed")

您可以使用 Snap() 方法在 Snap 中引用现有的 SVG 元素。例如

Snap("#textelement").attr("text","changed")

所以你也可以试试

Snap("#g54 text").attr("text","changed")

我不确定 jquery 是否与 svg 兼容，所以最好直接使用 Snap。

Answer 2

毕竟，Snap 选择器对大多数文本项都做到了，但对某些文本项却没有（我不明白为什么）。所以我用 JQuery 再次尝试，结果如下。

JQuery("#g54").children().text("this is my text");

如何更改 snap.svg 中的文本

How can I change text in snap.svg

jquery

snap.svg