Javascript 强制重新计算svg文本大小

我正在将

tspan

附加到

text

节点，但浏览器没有重新计算新的大小/框

JS代码：

var result = document.querySelector('#result');
var result_delayed = document.querySelector('#result_delayed');

var text = document.querySelector('text');
var tspan = document.createElement('tspan');
tspan.setAttribute('x', '0');
tspan.setAttribute('dy', '0');
tspan.innerText = 'text';
text.appendChild(tspan);

var box = text.getBBox();

result.innerHTML = box.width + ', ' + box.height;

它总是返回

0，0

，这意味着追加后不会重新计算大小

在这种情况下如何强制recalc

• SVG元素必须使用CreateElements创建

• innerText不是SVG元素上的函数。您可以改为使用textContent，它也适用于HTML元素

var result=document.querySelector（'#result'）；
var text=document.querySelector（'text'）；
var tspan=document.createElements（'http://www.w3.org/2000/svg","tspan",；
tspan.setAttribute（'x'，'0'）；
tspan.setAttribute（'dy'，'0'）；
tspan.textContent='text'；
text.appendChild（tspan）；
var-box=text.getBBox（）；
result.innerHTML=box.width+'，'+box.height

结果
这解决了这个问题，即使在IE11上也非常有效。非常感谢你！