Question

在我的代码中，我有一大堆数据，我将其分成一个表，使其看起来更具代表性。这很好，而且很棒。

但是，我在将数据重新组合在一起时遇到了问题，因此我可以将其存储为难看的blob，因为我无法更改任何后端。

我尝试过一个简单的连接，但是当它们需要重新组合在一起时，它会在不同的行中打印这些类。有什么想法吗？

<table class="table" id="DataTables_Table_5">
  <thead style="display:none;">
    <tr role="row">
      <th name="date" scope="col" class="sorting_disabled commentDate" rowspan="1" colspan="1" style="width: 0px;">Invalid date</th>
      <th name="user" scope="col" class="sorting_disabled commentUser" rowspan="1" colspan="1" style="width: 0px;">UserName</th>
      <th name="comment" scope="col" class="sorting_disabled commentComment" rowspan="1" colspan="1" style="width: 0px;">Comment</th>
    </tr>
  </thead>
  <tbody>
    <tr role="row" class="odd">
      <td class=" commentDate">Fr 01 12, 2017</td>
      <td class=" commentUser">Demo</td>
      <td class=" commentComment">skvbgskjhbgswdjefv</td>
    </tr>
    <tr role="row" class="even">
      <td class=" commentDate">Mo 04 12, 2017</td>
      <td class=" commentUser">DEMO</td>
      <td class=" commentComment">This issvgswrgwrgwrgwrg</td>
    </tr>
    <tr role="row" class="odd">
      <td class=" commentDate">Mo 04 12, 2017</td>
      <td class=" commentUser">DEMOoooo</td>
      <td class=" commentComment">Super long. Super aewsome. Super long. Super aewsome. Super long. Super aewsome. Super long. Super aewsome. Super long. Super aewsome. Super long. Super aewsome. Super long. Super aewsome. Super long. Super aewsome. Super long. Super aewsome. Super long. Super aewsome. Super long. Super aewsome. Super long. Super aewsome. </td>
    </tr>
    <tr role="row" class="even">
      <td class=" commentDate">Mo 04 12, 2017</td>
      <td class=" commentUser">DEMO DEMO</td>
      <td class=" commentComment">This is a short comment after the super long comment</td>
    </tr>
  </tbody>
</table>

我试过的js看起来像这样

$(".commentDate").text()+ '\n' + $(".commentUser").text() + '\n\n' + $(".commentComment").text()+ '\n\n'

https://www.bootply.com/8sDFSzV22Y

Answer 1

您需要读取每一行，然后读取每行的每个单元格以进行连接。

var rows = document.querySelectorAll( '#DataTables_Table_5 tr' );
var lines = [];

// Read each row
for ( var i = 0; i < rows.length; ++i ) {
  var r = rows[ i ];
  // Read each cell
  var cells = [].slice.call( r.querySelectorAll( 'td, th' ) )
    .map( function( c ) { return c.innerText } );
  // Collect concatenated cells
  lines.push( cells.join( ',' ) );
}

console.log( lines.join( '\n\n' ) );

<table class="table" id="DataTables_Table_5">
  <thead style="display:none;">
    <tr role="row">
      <th name="date" scope="col" class="sorting_disabled commentDate" rowspan="1" colspan="1" style="width: 0px;">Invalid date</th>
      <th name="user" scope="col" class="sorting_disabled commentUser" rowspan="1" colspan="1" style="width: 0px;">UserName</th>
      <th name="comment" scope="col" class="sorting_disabled commentComment" rowspan="1" colspan="1" style="width: 0px;">Comment</th>
    </tr>
  </thead>
  <tbody>
    <tr role="row" class="odd">
      <td class=" commentDate">Fr 01 12, 2017</td>
      <td class=" commentUser">Demo</td>
      <td class=" commentComment">skvbgskjhbgswdjefv</td>
    </tr>
    <tr role="row" class="even">
      <td class=" commentDate">Mo 04 12, 2017</td>
      <td class=" commentUser">DEMO</td>
      <td class=" commentComment">This issvgswrgwrgwrgwrg</td>
    </tr>
    <tr role="row" class="odd">
      <td class=" commentDate">Mo 04 12, 2017</td>
      <td class=" commentUser">DEMOoooo</td>
      <td class=" commentComment">Super long. Super aewsome. Super long. Super aewsome. Super long. Super aewsome. Super long. Super aewsome. Super long. Super aewsome. Super long. Super aewsome. Super long. Super aewsome. Super long. Super aewsome. Super long. Super aewsome. Super long. Super aewsome. Super long. Super aewsome. Super long. Super aewsome. </td>
    </tr>
    <tr role="row" class="even">
      <td class=" commentDate">Mo 04 12, 2017</td>
      <td class=" commentUser">DEMO DEMO</td>
      <td class=" commentComment">This is a short comment after the super long comment</td>
    </tr>
  </tbody>
</table>

将表中的文本组合成blob

1 个答案: