テーブルに入力を動的に挿入する

Question

jQueryを使用して、テキストボックス、チェックボックス、ボタンなどの入力を含む新しい行をテーブルに挿入する関数を作成しました。

これは私が持っているコードです：あなたは私のコードで見ることができるように

$('#AddEntry').click(function() { 
    var lastTrClass = $('tr:last').attr('class'); 

    var textBoxTitle = '<input id="titleid" type="text" value="" style="width: 100%; vertical-align: middle">'; 

    var textBoxStartDate = '<input id="StartDate" type="text" class="required DatePicker" value="" style="width: 100%; vertical-align: middle">'; 

    var checkBoxSync = '<input id="Sync" type="checkbox" checked="checked" disabled="disabled" value="true" style="vertical-align: middle">'; 

    var lastDate = '<input id="LastSyncDate" class="required DatePicker" type="text" value="" style="width: 100%; vertical-align: middle">'; 

    var buttonEdit = '<button id="btnEditar" class="EditButton icon_only text_only" style="vertical-align: middle;" type="button">Editar</button>'; 

    if (lastTrClass == 'gradeA odd') { 
     $('#DataTable > tbody:last').append("<tr class='gradeA even'><td>#</td><td>" + textBoxTitle + "</td><td>" + textBoxStartDate + "</td><td>" + checkBoxSync + "</td><td>" + lastDate + "</td><td>" + buttonEdit + "</td></tr>"); 
    } 
    else { 
     $('#DataTable > tbody:last').append("<tr class='gradeA odd'><td>#</td><td>" + textBoxTitle + "</td><td>" + textBoxStartDate + "</td><td>" + checkBoxSync + "</td><td>" + lastDate + "</td><td>" + buttonEdit + "</td></tr>"); 
    } 
}) 

、私はvarへの入力を生成していますが、私の質問はこれが安全であるかどうかではありません。私のコードはJSの注射などに脆弱ですか？これを行うより良い方法はありますか？

Answer 1

これはすべてクライアントで発生するので、コードは問題ありません。あなたは、クライアントのテンプレートをチェックアウトしたいかもしれませんが、この種のものについては - そしてあなたはバールを完全に取り除き、htmlを編集する方がより楽しいでしょう。私はjqoteを使って、比較的複雑なものをjavascriptからレンダリングする必要があります。