Javascript 有没有一种方法可以动态创建feTurbulence过滤器？

我试图创建一个对象数组，每个对象都有自己独特的feTurbulence过滤器和独特的属性。 我将生成过滤器，然后将它们附加到现有的SVG元素。 我遇到的问题是，当我尝试动态创建过滤器时，标记呈现为feturbulence而不是feturbulence。 以下是我迄今为止所尝试的：

var testfilter = document.createElement('filter');
var turbulence = document.createElement("feTurbulence")
var dispMap = document.createElement('feDisplacementMap')
var filterHolder = document.getElementById("filterHolder")
testfilter.setAttribute("id", "filter1");
turbulence.setAttribute("type","fractalNoise");
turbulence.setAttribute("baseFrequency",".003");
turbulence.setAttribute("numOctaves","5");
turbulence.setAttribute("seed","8517");
testfilter.appendChild(turbulence);
dispMap.setAttribute("in", "SourceGraphic");
dispMap.setAttribute("scale", "180");
testfilter.appendChild(dispMap);
filterHolder.appendChild(testfilter);

我已经尝试将feTurbulence作为一个变量传递，如下所示，但它仍然呈现为所有小写

var turbString = "feTurbulence";
var turbStringCap = turbString.substring(0,2) + turbString.charAt(2).toUpperCase() + turbString.slice(3);
var turbulence = document.createElement(""+turbStringCap+"")

---

有没有人知道如何避开这个问题，或者我哪里出了问题？如果您有任何建议，我将不胜感激

我已经重写了您的代码，现在正在工作。我希望这就是你要问的

const SVG\u NS=http://www.w3.org/2000/svg';
让testfilter=document.createElements（SVG_NS，'filter'）；
setAttribute（“id”、“filter1”）；
让湍流=document.createElements（SVG_NS，“feTurbulence”）；
湍流.setAttributeNS（空，“类型”，“分形噪声”）；
湍流.setAttributeNS（空，“基频”，“0.003”）；
湍流.setAttributeNS（空，“numOctaves”，“5”）；
刚毛（空，“种子”，“8517”）；
var dispMap=document.createElements（SVG_NS，'feDisplacementMap'）；
setAttributeNS（null，“in”，“SourceGraphic”）；
设置属性（空，“比例”，“180”）；
testfilter.appendChild（湍流）；
appendChild（dispMap）；
filterHolder.appendChild（testfilter）
#过滤器文件夹{宽度：0；高度：0；位置：绝对；左：-10em}
svg{border:1px solid}
必须使用CreateElements创建具有SVG命名空间的SVG元素。不能使用只创建HTML元素的createElement。