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

Posted 2023-05-09

【中文标题】尝试将 svg 从一个 div 移动到另一个 div 时导致层次结构请求错误的原因是啥？

【英文标题】：What causes an hierarchy request error when trying to move an svg from one div to another?尝试将 svg 从一个 div 移动到另一个 div 时导致层次结构请求错误的原因是什么？

【发布时间】：2014-09-07 01:10:00

【问题描述】：

我正在尝试将 svg 从一个 div 移动到另一个。 This stack question 提供了我尝试过的这个解决方案。

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

当我尝试这样做时，我收到了层次结构请求错误。 This stack question 提出了一些可能是原因的事情。我不能说我有这些东西，但我不确定。 Bot 我的 div 位于 body 元素中，并且没有相互嵌套，但是，其中一个 div 在使用 javascript 动态创建之前只有几行。这是我用来创建该 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.;
document.getElementById("LightBoxDiv").style.;
document.getElementById("LightBoxDiv").style.background="white";
document.getElementById("LightBoxDiv").style.zIndex="1001";
document.getElementById("LightBoxDiv").setAttribute("class","dotouch");

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

最后一行是引发错误的那一行。知道我做了什么导致错误吗？我该如何解决它。

谢谢，--克里斯托弗

【参考方案1】：

您正在将 jQuery 代码与标准 DOM API 混合。

函数appendChild() 需要一个DOM 节点，而不是元素ID。试试

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

【参考方案2】：

const lightboxdiv = document.getElementById("LightBoxDiv"); 

为什么要使用户的浏览器紧张 12 次以在已存储在变量中的文档 id 中搜索元素？

lightboxdiv.style.display = ...; 
lightboxdiv.style.position = ...; 

我认为它会很有效

【讨论】：

欢迎来到 Stack Overflow！堆栈溢出requires that all posts be in English。请编辑您的帖子或评论以遵守此规则或将其删除。您可以将其转发到以下允许非英语语言的特定语言 Stack Overflow 社区之一：Spanish、Japanese、Russian、Portuguese。

【参考方案3】：

我遇到了同样的错误，除了我没有使用 JQuery。 我发现的问题是，我试图从一个 Div 移动到另一个 Div 的元素是不可见的（即它的样式 display = 'none'）。

首先通过删除此样式然后附加它，为我解决了问题。