cloneNode()メソッドでノードの複製

■ cloneNode()メソッド
(書式) element.cloneNode(true/false)
 ・elementノードを複製し、複製したノードを返します。
 ・引数
   true・・・対象ノードに含まれる子ノード以下全てのノードも含んで複製されます。
   false・・・対象ノードのみが複製され、含まれる子ノード以下は複製されない。

Sample

下の入力欄を4個まで追加できます・・・→

入力

Sample Source......................................................................>>>

<script language="JavaScript"><!--
  var n = 2;      //id名に使用する番号
  function CloneText(){
    if(n < 5){     //複製を4個までに制限
      var txt = document.getElementById("txt1");
      var cloneT = txt.cloneNode(true);      //textBoxの複製を作成(子ノード以下を含む)
      cloneT.id = "txt" + n;   //重複しないid名を設定
      n++;
      document.getElementById("frm").appendChild(cloneT);   //フォーム内に複製を追加
    }
  }
//--></script>
</head>

<body>
<p>下の入力欄を4個まで追加できます・・・→<button onclick="CloneText()">追加</button></p>
<form id="frm"><p id="txt1">入力<input type="text" size="25"></p></form>  


(最終更新:13/1/5)
フレーム構成になっています・・・<[ホーム] >> [HTML整理ノート]>