使用JS更改SVG文本的字体大小

Question

所以我试图使用Javascript根据长度动态更改SVG文本元素的字体大小。

我尝试过使用.sytle.fontSize进行设置，但没有任何变化。 我也尝试使用更大的字体大小设置不同的类并在JS中更改类，但这也没有帮助。

HTML：

      <text id="Subtitle" text-anchor="middle" class="subtitle">
        <textPath id="SubtitleInnerHTML" xlink:href="#subtitleTextPath" startOffset="50%">
          MY TEXT
        </textPath>
      </text>

JS：

function ImageSubtitleSwap(content) {
   document.getElementById('SubtitleInnerHTML').innerHTML = content;  //This changes the text to whatever the user inputs, working correctly

   var str = String(content);
   var n = str.length;

   if(n <= 5) {
       document.getElementById('Subtitle').sytle.fontSize = "25px";
    }
}

CSS：

.subtitle {
font-family: 'Cinzel', serif;
font-size: 15px;
stroke: none;
fill: #c5eef6;
}

Answer 1

这最终只是一个错字;可以使用svg属性更改style文本元素字体大小。

document.getElementById('Subtitle').style.fontSize = "25px";