如何通过javascript在链接中单击时复制div_Javascript

如何通过javascript在链接中单击时复制div

javascript

如何通过javascript在链接中单击时复制div,javascript,Javascript,大家好，我是优秀的php开发人员，还没有学习js。。。。。我的问题是我有div <div id="test1"> </div> <a href="">add div</a> 我想当点击adddiv链接时，dublite div并将id中的数字更改为test2、test3、unlimited 比如说 <div id="test1"> </div> <div id="test2"> </div&g

大家好，我是优秀的php开发人员，还没有学习js。。。。。我的问题是我有div

<div id="test1">

</div>
<a href="">add div</a>

我想当点击adddiv链接时，dublite div并将id中的数字更改为test2、test3、unlimited 比如说

<div id="test1">

</div>
<div id="test2">

</div>
<div id="test3">

</div>

使用document.getElementById（）获取原始div

然后使用document.createElement（'div'）创建一个新的div

然后循环第一个div的所有属性，在第二个div上设置每个属性。将element.getAttribute（'id'）放入一个case中，并在设置之前递增该数字

完成新div后，执行originaldiv.parentNode.appendChild（newdiv）

如果使用jQuery，可以通过以下操作轻松完成此操作：

<html>
<head>
  <script type='text/javascript' src='http://code.jquery.com/jquery-1.5.js'></script>

  <script type='text/javascript'>
    $(document).ready(function(){
      $('#div-creator').click(function(){
       var numberOfDivs = $('.testClass').length;
       $('<div id="test' + numberOfDivs + '" class="testClass">hi</div>').appendTo('body');
      });
    });
  </script>

</head>
<body>
  <div id="test1" class="testClass"></div>
  <a href="javascript:void(0);" id="div-creator">Add Div</a> 
</body>
</html>


$（文档）.ready（函数（）{
$（“#div creator”）。单击（函数（）{
var numberOfDivs=$（'.testClass'）.length；
$（'hi'）。附加到（'body'）；
});
});

可以在这里找到演示：

直接使用Javascript或使用jQuery？thx，但我说我还没有学会js，所以我不知道document.getElementById（）的含义…好的，如果我想设置限制ex，我想限制为4，这意味着我可以增加超过4个div。在这里很难获得更新的代码。你可以检查这里的扩展示例：它显示了如何以最大4个div添加。既然你把这个标记为答案，请考虑投票表决：