appendChild不工作的一些元素

我正在研究一个香草javascript项目，所以我不能使用jQuery。我试图使用以下方法来从一个位置移动某些HTML到另一个：appendChild不工作的一些元素

parent.appendChild(element);

我想要的形式放置到不同的位置，我放置在我的HTML代码中的注释。我正在尝试，但它根本不工作。

的Javascript：

3210

HTML：

<header> 
    <nav data-nav-services> 
     <ul class="nav-services"> 
      <li data-test> 
       <a class="icon icon-shopping-cart icon-arrow-down" href="#" data-shopping-cart-header-button> 
        shopping cart 
       </a> 
       <!-- PLACEMENT FOR data-shopping-header-cart --> 
      </li> 
      <li> 
       <a class="icon icon-user icon-arrow-down" href="#" data-login-header-button> 
        Login 
       </a> 
       <!-- PLACEMENT FOR data-login-dropdown --> 
      </li> 
     </ul> 
    </nav> 

    <form class="login-dropdown" data-login-dropdown> 
     ...CONTENT... 
    </form> 

    <form class="shopping-cart" data-shopping-header-cart> 
     ..CONTENT.. 
    </form> 
</header>

奇怪的是，如果我转身的选择（如这里下文），它的工作，我无法解释为什么...

shopCartDropdown.parentNode.appendChild(shopCartButton); 
shopCartDropdown.parentNode.appendChild(loginButton);

来源

2014-06-24 Daniel Ramirez-Escudero

你原来的代码适合我。 http://jsfiddle.net/8mB3h/ – Arbel

@Arbel我真的不明白为什么，但小提琴是逻辑结果，这正是我所需要的，但在我的代码中它只能绕过选择器。真的很奇怪......如果我发现了什么，我会让你知道的。 –

对于任何想要知道的人来说，代码是完美的。问题是我在我的代码的其他地方添加了这个表单。所以出现了冲突，因为一方优先于另一方。我可以使用.cloneNode(true)作为解决方案。我结束了转变，追求我的新目标并解决了这个问题。

有人在那里...检查所有代码的任何其他追加相同的元素。好建议;）

来源

2014-06-25 08:48:48

当你这样做：

shopCartButton.parentNode.appendChild(shopCartDropdown); 
loginButton.parentNode.appendChild(loginDropdown);

它确实有效。它只是没有显示任何内容，因为表格是空的。检查你的开发工具并检查你的HTML。

来源

2014-06-24 18:25:30 beautifulcoder

appendChild不工作的一些元素

回答

相关问题