为什么 setAttribute 在带有 SVG 的 Javascript 中不起作用？

【问题标题】：Why is setAttribute not working in Javascript with SVG?为什么 setAttribute 在带有 SVG 的 Javascript 中不起作用？
【发布时间】：2020-01-10 13:00:13
【问题描述】：

我是 SVG 和 Javascript 的初学者，如果有人可以帮助我，我会很高兴。有谁知道为什么在 SVG 和 Javascript 中使用此代码

<g id="package1">

  <rect style="opacity:1;fill:#00b609;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" id="rect991" width="1.6536481" height="11.641669" x="145.52083" y="28.447916" />

</g>

<script type="text/javascript" id="move">
  var package1 = document.getElementById("package1");

  package1.setAttribute("transform", "translate(210,120) rotate(-10 50 100)");
</script>

即使应该旋转矩形也没有任何反应？

谢谢！

【问题讨论】：

标签： javascript svg transform

【解决方案1】：

它做了一些事情。您需要将 rect 放入 svg 元素中。

  setTimeout(() => {
    var package1 = document.getElementById("package1");

   package1.setAttribute("transform", "translate(210,120) rotate(-10 50 100)"); 
   }, 2000);

#package1 {
  border: 1pt solid red;
}

<svg id="package1">

  <rect style="opacity:1;fill:#00b609;fill-opacity:1;stroke:#ffffff;stroke-width:1;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" id="rect991" width="10.6536481" height="110.641669" x="145.52083" y="28.447916" />

</svg>

【讨论】：

谢谢，现在我知道代码本身可以工作了。我确实将 rect 和 Javascript-Code 放在了一个 svg 元素中，我会尝试找出问题所在。
我在删除的脚本部分中有更多代码，现在它可以工作了！谢谢！
@ppp 太好了。乐意效劳。如果您满意，请为答案投票。