javascript - 是否可以更改作为文本元素克隆的 svg use 元素的 textContent 值?

标签 javascript svg text element

我有一个使用 use 元素克隆的 svg 文本元素。有没有办法更改 use 元素克隆的文本值,使其与源元素不同?我尝试了以下方法但没有成功。

use2[i]=document.createElementNS(svgns, "use");
use2[i].setAttributeNS(xlinkns, "xlink:href", "#hsc");
use2[i].setAttribute("x", ((i+1)*45+45));
use2[i].setAttribute("y", "0");
use2[i].textContent=(useCount+3);
document.getElementById("redarrows").appendChild(use2[i]);

浏览器 dom explorer 显示 use 元素的 textContent 值为 useCount+3,但在屏幕上 use 元素仍然显示源文本元素的 textContnet。

这是我正在克隆的文本元素。

<text id="hsc" x="52.5" y="137" font-family="'Utsaah'" font-size="21">1</text>

最佳答案

不,<use>只是底层内容的 View (<use> 指向的内容)。它没有自己的内容 DOM。

如果您在<use>内创建内容如您所见,它将被忽略元素。

如果您想要不同的内容,那么您可以随时使用 element.cloneNode() 自行克隆并附加它。但要小心不要创建重复的元素 id。

关于javascript - 是否可以更改作为文本元素克隆的 svg use 元素的 textContent 值?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24217284/

相关文章:

javascript - d3js v4 : How can I apply force to nodes onclick and make it look like a tween?

python - 快速重新排列文本文件

javascript - 滚动时隐藏 div,停止时显示 div

javascript - 我如何使用js eval返回一个值?

javascript - React-Router:没有找到路由?

javascript - 在SVG中,有一种方法可以在填充= "none"时在任何地方抓取形状

svg - 如何在 svg 文本中保留空格

java - Android中写入 "text"和Resource ID

sql - 不兼容的数据透视类型 SQL

javascript - Angular ng-model 在 JS 中未定义