js 动态添加删除div

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document  </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD><BODY>
<script language="javascript">
function aa()
{
var thenew= document.createElement('div');
thenew.innerHTML = document.getElementById('lizi').innerHTML;document.getElementById('bbbb').appendChild(thenew);
}
function bb()
{
document.getElementById('bbbb').childNodes[0].removeNode(true);
}
</script>
<form action="jsadd.php" method="post">
<div id="lizi"> remove  <br />Frist Name:  <input type="text" value="aaaa" name="name[]" />  </div>
<div id="bbbb" style="background-color:#CCCCCC;"> </div>
<a onclick="aa()" href="#" >Add new </a>
<a onclick="bb()" href="#" >dell </a>
</form> 
</BODY>
</HTML> 

解决方案 »

  1.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
    <HEAD>
    <TITLE> New Document  </TITLE>
    <META NAME="Generator" CONTENT="EditPlus">
    <META NAME="Author" CONTENT="">
    <META NAME="Keywords" CONTENT="">
    <META NAME="Description" CONTENT="">
    </HEAD><BODY>
    <script language="javascript">
    function aa()
    {
    var thenew= document.createElement('div');
    thenew.innerHTML = document.getElementById('lizi').innerHTML;document.getElementById('bbbb').appendChild(thenew);
    }
    function bb()
    {
    document.getElementById('bbbb').removeChild(document.getElementById('bbbb').childNodes[0]);
    }
    </script>
    <form action="jsadd.php" method="post">
    <div id="lizi"> remove  <br />Frist Name:  <input type="text" value="aaaa" name="name[]" />  </div>
    <div id="bbbb" style="background-color:#CCCCCC;"> </div>
    <a onclick="aa()" href="#" >Add new </a>
    <a onclick="bb()" href="#" >dell </a>
    </form> 
    </BODY>
    </HTML> 这个支持 ie 和 firefox
      

  2.   

    createElement
    appendChild
    removeChild
      

  3.   

    <script language="javascript"> 
    function aa() 
    { 
    var thenew= document.createElement('div'); 
    thenew.innerHTML = document.getElementById('lizi').innerHTML; document.getElementById('bbbb').appendChild(thenew); 
    } 
    function bb(){
    document.getElementById('bbbb').removeNode(true);//也可以这样
    }
    </script> 
    <form action="jsadd.php" method="post"> 
    <div id="lizi"> remove  <br />Frist Name:  <input type="text" value="aaaa" name="name[]" />  </div> 
    <div id="bbbb" style="background-color:#CCCCCC;"> </div> 
    <a onclick="aa()" href="#" >Add new </a> <br>
    <a onclick="bb()" href="#" >remove </a> 
    </form> 
      

  4.   


    <script language="javascript"> 
    function aa() 
    { 
    var thenew= document.createElement('div'); 
    thenew.innerHTML = document.getElementById('lizi').innerHTML; document.getElementById('bbbb').appendChild(thenew); 
    } 
    function bb(){
        document.getElementById('bbbb').removeNode(true);//也可以这样
    }
    </script> 
    <form action="jsadd.php" method="post"> 
    <div id="lizi"> remove  <br />Frist Name:  <input type="text" value="aaaa" name="name[]" />  </div> 
    <div id="bbbb" style="background-color:#CCCCCC;"> </div> 
    <a onclick="aa()" href="#" >Add new </a> <br>
    <a onclick="bb()" href="#" >remove </a> 
    </form> 
      

  5.   

    function bbb(o) 
    { 
    var b = o.parentNode;
    b.parentNode.removeChild(b);}
    这个是我总结出来最简单的,而且支持 fox , ie
      

  6.   

    var b = o.parentNode; 
    b.parentNode.removeChild(b); 
      

  7.   

    Yes,onchick="bbb(this)";谢谢大家的关注,和帮助.
      

  8.   

    我想知道，如何删除你指定的那个div，并不像你们写的得那样，只能添加一个删除一个，不太好
    最好能指定的
      

  9.   

    新创建的div怎么设置style ??