JQueryは特定のthにtdを追加します

Question

私はtableを持っていて、いくつかはそれぞれthの要素を持ち、それぞれ固有の値を持っています。

私はth値と一致するtdtd値を追加し、同じ順序の下でそれを追加します。

私はこのコードを試しましたが、同じthの中にデータを追加しました！ trの新しい行にtdが必要です。私はこのすべては、ループ内で、その前提で発生していると仮定しています

$("<td>" + data[i][0].counter + "</td>").insertAfter("#datatable th[value='"+data[i][d].orderStatus+"']").trigger("create"); 

Answer 1

$("<td>" + data[i][0].counter + "</td>") 
        .insertAfter("#datatable th[value='"+data[i][d].orderStatus+"']") 
        .trigger("create"); 

、これは私がオフ動作するものです。最初に、まず始めにコードをステップバイステップで実行し、いくつかのことを理解できるようにします。

$（ "" +データ[i]が[0] .counter + ""）あなたとして

かがは認識していない可能性があり、jqueryの中$("x")が相当ですCSSセレクタを使用します。例えば、私はjQueryを使って黒い背景を持っている.example-divのクラスを持つすべての<div>の要素を設定したい場合は、 - 私は次のようにそうすることができます：

<div class="example-div">Hello, World!</div> 

<script> 
    $('.example-div').css({"background-color":"#000000"}); 
    /* OR if I wanted to set all divs to have a black background. */ 
    $('div').css({"background-color":"#000000"}); 
</script> 

セレクタに<>と物理タグを配置します最も問題を引き起こす可能性があります。まず、対話したい要素（s）を選択する必要があります。あなたの場合、あなたの必要性に応じて、次のことが働く可能性があります。

$("#datatable th[value='"+data[i][d].orderStatus+"']") 

また、私がセレクターに行った変更を見てください。 #datatableの後に>を削除しました。より大きい文字（>）は直下の子を選択し、<th>は<table id="datatable">の子ではありません。これは、この例に示すように<thead>の子である<tr>の子である：あなたのコードの次の部分のために今

$("#datatable > thead > tr > th")

：（<table><thead><tr><th>）これがうまくいく場合、以下であります：ときにあなたは何を意味するのか、このを見て、私は理解して

InsertAfter（ "＃DataTableの番目の[値= ' "+データ[i]と[D] .orderStatus +"']"）

wroそれをね。値data[i][d].orderStatusを含む<th>タグの後に挿入物"<td>" + data[i][0].counter + "<td>"を挿入するとします。 htmlの後にセレクタを挿入しようとしているので、これらを逆にしたことになります。

$("#datatable th[value='"+data[i][d].orderStatus+"']").after("<td>" + data[i][0].counter + "</td>"); 

注：ここでは仕事がなければならないものだ、私はafter代わりinsertAfterの使用していることに注意してください、これは関係ありません。

.after（）および.insertAfter（）メソッドは同じタスクを実行します。 [（& InsertAfter後）] [1] [1]：http://api.jquery.com/insertafter/

私はあなたがcreateとトリガーしようとしている何のイベントかわからないが、それはまだ必要だ場合は、最後にこれを、連鎖することができます。

$("#datatable th[value='"+data[i][d].orderStatus+"']").after("<td>" + data[i][0].counter + "</td>").trigger("create");