n番目の位置に新しい列を追加するJavascript

Question

新しい列をn番目の位置に動的に追加しようとしています。現在、私のコードを以下で見つけてください。

var name = window.prompt("Please enter the Column Name you intend to Add", ""); 
var name2 = window.prompt("Please enter the Column Location you intend to Add", ""); 
if (name == null || name.trim() == "" || name == "0") { 
    alert('Invalid Column Number'); 
} 
else if (name2 == null || name2.trim() == "" || name2 == "0") { 
    alert('Invalid Column Number'); 
} 
else { 
    var name1 = parseInt(name2); 
    $('td:nth-child(' + name1 + ')').append($("<td>")); 
    $('th:nth-child(' + name1 + ')').html(name).css("font-weight", "Bold");  
} 

HTMLマークアップ

<div class="table-responsive" style="margin-top:10px;"> 
       <table class="table table-striped table-bordered table-hover" id="myTable"> 
       <thead> 
        <tr> 
         <th>Sl No</th> 
         <th>Item Id</th> 
         <th>Item Description</th> 
         <th>Quantity</th> 
        </tr> 
       </thead> 
       <tbody> 
        <tr id="mainid"> 
         <td><input type="text"/></td> 
         <td><input type="text"/></td> 
         <td><input type="text"/></td> 
         <td><input type="text"/></td> 
        </tr> 
       </tbody> 
       </table> 
      </div> 

私は正常に新しい列を追加することができていますが、これは既存のものを置き換えています。私が必要とするのは、番号付きの列をインデックスに追加することですが、それを置き換えます。誰でもこれを解決するためのガイドをしてください。

Answer 1

はそれがbeforeあなたがインデックスで見つかったtdは、ないあなたが実際に見つかったtdの子としてtdを追加していない兄弟として

一つれるtdを追加している

$('td:nth-child(' + name1 + ')').insertBefore($("<td>")); 

を追加挿入します提案も同様に

また、この行を実行してt彼の新しい列のヘッダ

$('th:nth-child(' + name1 + ')').insertBefore($("<th>"));