svg中的javascript错误

我试图通过javascript在svg中创建一个新元素，但浏览器因为for循环而崩溃； 代码如下：

    <svg width="100%" height="100%" viewBox="0 0 1500 1000" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink">
      <script>       
        var $x=0;
        var $y=0;
        var $z=2;
      for(var $i=0; $i=10; $i++){
        var svg = document.getElementsByTagName('svg')[0];
        var newElement = document.createElementNS("http://www.w3.org/2000/svg", 'rect');
        newElement.setAttribute("x",$x +"%");
        newElement.setAttribute("y",$y +"%");
        newElement.setAttribute("height","4%");
        newElement.setAttribute("width","4%");
        newElement.style.fill="#FFA7A7";
        svg.appendChild(newElement);
        $x=$x+4;

       };              
      </script>
    </svg>

---

这是清理后的代码：

变量x=0，y=0； 对于var i=0；i<10；i++{ var svg=document.getElementsByTagName'svg'[0]； var newElement=document.createElementshttp://www.w3.org/2000/svg“rect”； newElement.setAttributex，x+%； newElement.setAttributey，y+%； newElement.setAttributeHight，4%； newElement.setAttributewidth，4%； newElement.style.fill=FFA7A7； svg.appendChildnewElement； x=x+4； };

---

由于您给其中一个的参数，您的循环将永远不会启动。我需要放入$iNah，第二个参数用于告诉for循环何时应该工作，而不是何时应该结束。$i=10。。。永远是真的。。。循环一直运行到时间结束。。。可能应该是$i<10。。。换句话说，循环直到$i是10是，但浏览器会在for中的无限循环中崩溃。条件$i=10不太正确。它产生了一个无限循环。接受答案会很好，这是另一个错误；svg文件不支持for循环，我应该将其放在html中……它可能不作为规范支持，但是，正如您在我的示例中看到的，它是有效的。@Vann'TileIanito您可以将解释直接放在答案中，以供将来参考。