Javascript 动态创建的SVG不适用于Firefox，但适用于Chrome

我正试图弄明白为什么这段代码在Firefox中不起作用。它应该创建水平路径，但我在Firefox中看不到它们。Chrome和IE正确显示它们。可能是什么问题

$（文档）.ready（函数（）{
var svgBottomWall=document.getElementById（“svgBottomWall”）；
var rect=svgBottomWall.getBoundingClientRect（）；
var svgW=矩形宽度；
函数createHorizontalLine（w，d）{
var nline=document.createElements（“http://www.w3.org/2000/svg“，”路径“）；
nline.setAttribute（“d”，“m0”+d+”，L“+w+”+d）；
nline.setAttribute（“笔划宽度”，1）；
nline.setAttribute（“笔划”，“#ffffff”）；
document.getElementById（“svgBottomWallGridGroup”）.appendChild（nline）；
}
对于（var i=0；i您的
d
路径参数的格式不正确

你有点像

d="M 0 100, L 1000 100"

然而它应该是

d="M 0,100 L 1000,100"

看

解决办法是

nline.setAttribute("d", "M 0," + d + " L " + w + "," + d);

似乎是
svgBottomWall。clientWidth
就像你在Firefox中的小提琴一样返回
0
。我尝试在循环中使用固定值，但仍然不起作用，所以这只是你的问题之一。
d="M 0,100 L 1000,100"

nline.setAttribute("d", "M 0," + d + " L " + w + "," + d);