使用 JS 更改 svg 元素的位置

Question

尝试制作一个在按下按钮时移动的 svg 矩形。现在我只想让 x 被一个函数修改。

function modX()
{
  document.getElementById("rectangle").transform = 'translate(295 115)';
}
var x = 20;
var y = 20;
modX();

<svg  width="1000" height="1000" >
  <rect id="rectangle" x="0" y="20" width="100" height="100" 
  style="fill:rgb(0,0,255);stroke-width:3;stroke:rgb(0,0,0)"></rect>
</svg>

我对代码比较陌生，所以请避免使用 css 或 jquery。

Answer 1

您可以使用 javaScript document.getElementById("rectangle").setAttribute('x', X_value) 更改其 x 将X_value 设置为您希望它更改的值。