尝试将svg从一个div移动到另一个div时,导致层次结构请求错误的原因是什么？

Question

我试图将一个svg从一个div移动到另一个div. 这个堆栈问题提供了我试过的这个解决方案.

document.getElementById("LightBoxDiv").appendChild(svgId+"V");

当我尝试这个时,我收到了一个层次结构请求错误. 这个堆栈问题提出了几个可能是原因的事情.我不能说我有这些东西,但我不确定.Bot我的div在body元素中并没有嵌套在另一个中,然而,在使用javascript动态创建之前,其中一个div只有几行.这是我用来创建div的脚本.

var lightboxdiv = document.createElement('div');
lightboxdiv.id = "LightBoxDiv";
document.body.appendChild(lightboxdiv);
document.getElementById("LightBoxDiv").style.display="block";
document.getElementById("LightBoxDiv").style.position="fixed";
document.getElementById("LightBoxDiv").style.overflow="hidden";
document.getElementById("LightBoxDiv").style.padding="5%";
document.getElementById("LightBoxDiv").style.top=0;
document.getElementById("LightBoxDiv").style.left=0;
document.getElementById("LightBoxDiv").style.width="100%";
document.getElementById("LightBoxDiv").style.height="100%";
document.getElementById("LightBoxDiv").style.background="white";
document.getElementById("LightBoxDiv").style.zIndex="1001";
document.getElementById("LightBoxDiv").setAttribute("class","dotouch");

document.getElementById("LightBoxDiv").appendChild(svgId+"V");

最后一行是抛出错误的那一行.知道我做了什么导致错误吗？我该怎么办呢？

谢谢, - 克里斯托弗

Answer 1

您正在将jQuery代码与标准DOM API混合使用.

该函数appendChild()需要DOM节点,而不是元素ID.尝试

var svg = document.getElementById(svgId+"V");
document.getElementById("LightBoxDiv").appendChild(svg);