如何使用javascript动态地添加和移除Div标记

我将如何简单移除并实时添加div？而且我已经在页面上手动创建了div，所以即使在第一次运行该函数时，它也会被删除。在div被称为 'testElem'如何使用javascript动态地添加和移除Div标记

我想：

  var remDiv = document.getElementById('testElem'); 
      document.body.removeChild(remDiv); 

      var divTag = document.createElement("div"); 
      divTag.id = "testElem"; 
      document.body.appendChild(divTag);

但脚本不能正常工作。我尝试在第一个remDiv之后放置一个“alert”来测试。但它甚至没有通过那里。代码中断。在铬我试着去工具> Javascript控制台，但没有错误。有没有更好的方式来调试JavaScript，所以我可以看到错误是什么？

我只是试图做到这一点，所以它会删除div中的内容，每次函数运行时内容不会翻倍。每次都不一样。使用jQuery

来源

2011-09-05 brybam

：

$('#testElem').remove(); 
$('body').append($('<div id="testElem"></div>'));

来源

2011-09-05 07:31:03 Samich

另一种解决方案是让你需要所有div的列表，然后交替称为知名度

该解决方案的样式属性是这样的：

----- HTML ------

<div id="div1" style="visibility:hidden;" > 
<div id="div2" style="visibility:hidden;" > 
<div id="div3" style="visibility:hidden;" > 
.....

----- JS --------

//to Hide 
var x=document.getElementById("divToHide"); 
x.style.visibility="visible"; 
//to show 
ar x=document.getElementById("divToShow"); 
x.style.visibility="hidden";

该解决方案还为您提供更好的控制，其中在div将被放置

来源

2011-09-05 07:37:05 xsari3x

'display'更往往比'visibility'有用的，因为设置'display'到'none'将从流删除元素，而不仅仅是不渲染它。 – icktoofay

removeChild需要从要删除的div的父级调用。

，所以你会想这样的代码：

var remDiv = document.getElementById('testElem'); 
var parent = remDiv.parentNode; 
parent.removeChild(remDiv); 

var divTag = document.createElement("div"); 
divTag.id = "testElem"; 
parent.appendChild(divTag);

来源

2011-09-05 07:50:59 yoavmatchulsky

如何使用javascript动态地添加和移除Div标记

回答

相关问题