javascript - テーブル行内にテーブルを動的に生成する

Question

HTML ジェネリック コントロールを使用してテーブルを生成する Web アプリケーションがあります。動的に作成された各行にボタンがあります。私の質問は、ボタンを保持する対応する行の下に新しいテーブルを追加するにはどうすればよいですか?

Answer 1

jQuery を使用した例を次に示します。私の経験では、純粋な JS でテーブルを操作するのは少し面倒です。

jsFiddle を参照してください

HTML

<table>
    <tr>
        <td><button class="add-table">Add table</button></td>
    </tr>
    <tr>
        <td><button class="add-table">Add table</button></td>
    </tr>
</table>

jQuery

$(document).ready(function () {
    $('.add-table').click(function () {
        $(this).after('<table>\
            <tr>\
            <td>New table</td>\
            </tr>\
            </table>');
    });
});