Question

我们可以将数据从thead复制到tbody吗？我只想获得数据日期

<table>
 <thead>
  <tr>
   <td data-date="2017-10-08"></td>
   <td data-date="2017-10-09"></td>
   <td data-date="2017-10-10"></td>
   <td data-date="2017-10-11"></td>
   <td data-date="2017-10-12"></td>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td></td>
   <td></td>
   <td></td>
   <td></td>
   <td></td>
  </tr>
 </tbody>

我可以复制thead tr td的属性吗？到了tbody tr？所以它也将成为

<table>
 <thead>
  <tr>
   <td data-date="2017-10-08"></td>
   <td data-date="2017-10-09"></td>
   <td data-date="2017-10-10"></td>
   <td data-date="2017-10-11"></td>
   <td data-date="2017-10-12"></td>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td data-date="2017-10-08"></td>
   <td data-date="2017-10-09"></td>
   <td data-date="2017-10-10"></td>
   <td data-date="2017-10-11"></td>
   <td data-date="2017-10-12"></td>
  </tr>
 </tbody>

请注意，我无法手动将属性设置为来自插件

Answer 1

试试这个解决方案。同时获取tds并迭代一个，使用该索引并将data-date复制到tbody tds。

const theadTds = $('thead tr td');
const tbodyTds = $('tbody tr td');

theadTds.each((index, td) => { 
    const tbodyTd = tbodyTds.eq(index); // Get current tbody td
    tbodyTd.data('date', $(td).data('date')); // Set the `data-date` to the `thead td` `data-date`
    console.log(tbodyTd.data('date'));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
 <thead>
  <tr>
   <td data-date="2017-10-08"></td>
   <td data-date="2017-10-09"></td>
   <td data-date="2017-10-10"></td>
   <td data-date="2017-10-11"></td>
   <td data-date="2017-10-12"></td>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td></td>
   <td></td>
   <td></td>
   <td></td>
   <td></td>
  </tr>
 </tbody>

Answer 2

您可以在数组中设置标头it(`should create the navigation with 'Help' link`, () => { component.navigationLinks$.subscribe((links) => { console.log(links); // This should print an array of Links }); });值，然后使用该数组使用jQuery td函数设置它。检查下面更新的代码段。

＆＃13;

each()

＆＃13;

var xyz = [];
$('table thead td').each(function(){
    xyz.push($(this).data('date'));
})
$('table tbody td').each(function(i,el){
    $(this).data('date', xyz[i]).html(xyz[i]);
})

＆＃13;

Answer 3

不需要任何临时变量等。只需遍历列，这将执行正文中的所有行，如果您只想要第一行，您也可以这样做。

$('thead').find('tr').find('td').each(function(index){ 
   $('tbody').find('tr').find('td').eq(index).data('date',$(this).data('date')):
});

只有身体的第一行

$('thead').find('tr').find('td').each(function(index){ 
   $('tbody').find('tr').eq(0).find('td').eq(index).data('date',$(this).data('date')):
});

替代语法，如果您更清楚

$('thead').find('tr').find('td').each(function(index,element){ 
   $('tbody').find('tr').eq(0).find('td').eq(index).data('date',$(element).data('date')):
});

Jquery将thead tr td的属性复制到tbody tr td

3 个答案: