如何点击一个按钮，然后在当前页面生成一个包含文本输入框和按钮的div

本人刚入门小白。思路有限 而且语文表达能力不好 还望大大们耐心看看，帮忙出谋划策。要求为
1，点击一个按钮A，然后在当前页面生成一个包含“文本输入框A”和“按钮B”的div
2，点击div里的“按钮B”可以在文本框A下再生成一个新的文本框B。我一开始定义两个function分别对应两个按钮，然后通过用insertAdjacentHTML插入对应的元素。算是实现要求了可是有个问题，就是编号问题。（后面涉及到数据存储，为方便需要编号）
div编号简单 var一个全局的变量 ，然后每次点击按钮 变量++就可以了。
但不同div里面的文本框编号是相互独立的，它的编号又该怎么弄？本人非常菜 接触编程技巧有限，或许思路错了 或者 那位大大有更好的办法一起来讨论一下。感激不敬

解决方案 »

  1.   

    div以序号1,2,3等做ID；
    div下的input可以考虑在div的ID基础上加个_1,_2,_3等的ID后缀这样取div直接document.getElementById("序号"）；取input直接document.getElementById("div序号_input序号")
      

  2.   

    input的id根据你容器div的id，再追加一个数字或其它是不是也可以
      

  3.   

    <html>
     <body> <div>
    <button type="buttion"  onclick=doCreate($(this))>A-0</button>
     </div></body>
    <script type="text/javascript" language="javascript">
      var index = 0;function doCreate(obj){
    index = index + 1;
    var html= "";

    html= "<div>"
    +"<button type='button' value='' onclick=doCreate($(this)) >A-"+index+"</button>"
    +"<input type='text' value='' />"
    +"</div>";
    obj.parent().append(html);
    }</script>
    </html>