为什么我的两个变量不能添加相同的对象？Javascript

不允许两个变量添加同一对象。 这是一个片段

 for (var i = 0; i < categories.length; i++) {
                    var categoryId= categories[i].getElementsByTagName("CategoryID")[0].firstChild.nodeValue;
                    var categoryName = categories[i].getElementsByTagName("CategoryName")[0].firstChild.nodeValue;
                    var eleOpt = document.createElement("option");
                    var txtOpt = document.createTextNode(categoryName);


                    var catelogryAddOption = new Option(categoryName, categoryId);
                    sel.options.add(catelogryAddOption);

                    sel2.options.add(catelogryAddOption); //Here is an exception.


                }

for（变量i=0；i

但是，当我声明另一个对象catelogryAddOption2时，它可以工作

enter code herefor (var i = 0; i < categories.length; i++) {
                    var categoryId= categories[i].getElementsByTagName("CategoryID")[0].firstChild.nodeValue;
                    var categoryName = categories[i].getElementsByTagName("CategoryName")[0].firstChild.nodeValue;
                    var eleOpt = document.createElement("option");
                    var txtOpt = document.createTextNode(categoryName);


                    var catelogryAddOption = new Option(categoryName, categoryId);
                    sel.options.add(catelogryAddOption);

                    var catelogryAddOption2 = new Option(categoryName, categoryId);   //This is catelogryAddOption2
                    sel2.options.add(catelogryAddOption2); // It can work


                }

在此输入代码（变量i=0；i

虽然问题解决了，但我不明白原因。 有人解释吗？

---

谢谢。

这很简单-DOM中的一个元素不能有两个父元素

如果尝试将已添加的元素作为子元素添加到DOM中，则该元素将作为子元素从先前的元素中删除

是用于创建HTMLOptionElement的构造函数。选项构造函数起源于DOM脚本编写的早期，具有非标准语法，但在浏览器中普遍支持

newoption（）

返回一个本质上是节点的

HTMLOptionElement

根据规范，节点不能同时位于文档的两点。因此，如果节点已经有父节点，则首先移除该节点，然后将其附加到新位置

可用于在将节点附加到新父节点下之前创建节点的副本

var select1=document.getElementById（'select1'）；
var select2=document.getElementById（'select2'）；
var select3=document.getElementById（'select3'）；
var catelogryAddOption=新选项（'categoryName'，'categoryId'）；
选择1.options.add（catelogryAddOption.cloneNode（true））；
选择2.options.add（catelogryAddOption.cloneNode（true））；
选择3.options.add（catelogryAddOption.cloneNode（true））

沃尔沃汽车
萨博
梅赛德斯
奥迪
沃尔沃汽车
萨博
梅赛德斯
奥迪
沃尔沃汽车
萨博
梅赛德斯
奥迪
选项被添加到chrome中的第二个（或最后一个）选择中，因此一旦元素被添加到DOM中，它就不能再添加到任何其他地方，这似乎是不明确的。请参阅：@RayonDabre它被添加到第二个选择中，但随后从第一个选择中删除。我同意这条线是模棱两可的，改变了同样的情况。