如何通过Jquery在“data-row-num”中添加动态值

Question

我想为我的 HTML 表格行添加 (data-row-num="1",data-row-num="2",data-row-num="3") 。 有人可以帮我这样做吗？

<table id="example" class="table table-striped first-table" style="width:100%">
    <thead>
        <tr>
            <th>Name</th>
            <th>Position</th>
            <th>Office</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Tiger Nixon</td>
            <td>System Architect</td>
            <td>Edinburgh</td>
        </tr>
           <tr>
            <td>Cedric Kelly</td>
            <td>Senior Javascript Developer</td>
            <td>Edinburgh</td>
        </tr>
        
      </tbody></table>
<script type="text/javascript">
$(document).ready(function() {
        $('#example').dataTable( {  } );
} );

  $("tr").each(function() {
      $("tr").attr("data-row-num",????); 
}); 
<script>

Answer 1

您需要修改您的代码，如下所示：

var counter = 1;

 $("tbody tr").each(function() {
   $(this).attr("data-row-num",counter);
   counter++;
});