Javascript 为什么这个SVG元素中有隐藏文本节点？

我在SVG中有4条复杂的多段线，包含在父元素（myline）中。我希望将多段线存储在数组中，以便稍后在代码中调用它们。出于某种原因，浏览器认为“myLines”父元素中的多段线之间存在隐藏的文本节点。当我尝试使用开发工具在inspector中查找节点时，浏览器会说“一些节点被隐藏”，指的是这些节点

但是，当我使用appendChild并将多段线从一个元素移动到另一个元素时，浏览器仅检测实际存在的4条多段线

这是怎么回事

我已经想到了一些解决方法来避免这个问题，但我更希望知道wtf正在进行，这样我就可以真正地修复它，并了解我做错了什么

var main=document.querySelector（'main'）；
var line=main.querySelectorAll（'g#myline'）；
var元素=document.getElementById（“myLines2”）；
var elArray=[]；
控制台日志（行）；
对于（z=0；z，文本节点指的是SVG表示中
多段线
元素之间的空白（换行符）

考虑这个例子，我们得到一个对组
g1
的引用，并检查子节点的数量。这个例子将打印出
3
，引用
rect
元素（文本节点）之前的空格、
rect
元素本身（元素节点）以及
rect
元素之后的空格（文本节点）


const group=document.getElementById（'g1'）；
console.log（group.childNodes.length）；//3个节点

不确定我是否理解您的问题，但我认为这些隐藏的文本节点是空格、新行和/或制表符，用于格式化html代码以使其更具可读性。当您将元素附加到某个父元素时，这些制表符中不存在新行和空格，因为这些元素是在没有c的情况下直接追加的ode格式。为了增加可读性，可以使用
n.nodeType===Node.ELEMENT\u Node