Question

你好我所有的好php开发人员还没学习js .....我的问题是我有div

<div id="test1">

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

我想点击添加div链接，dublicte div并更改id中的数字为test2，test3，无限制像例子

<div id="test1">

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

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

</div>

Answer 1

如果您使用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>

演示可以在这里找到：http://jsfiddle.net/4eDkJ/1/

Answer 2

使用document.getElementById（）

获取原始div

然后使用document.createElement（'div'）

创建一个新的div

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

当您的新div完成后，请执行originaldiv.parentNode.appendChild（newdiv）

如何通过javascript点击链接时复制div

2 个答案: