如何在.txt文件中保存Html表数据?

Bha*_*tya 5 html javascript jquery

这是我的Html表.

<table>
  <thead>
    <tr>
      <th>First Name</th>
      <th>Last Name</th>
      <th>Email Id</th>
      <th>Phone Number</th>
      <th>Prefered Contact</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>James</td>
      <td>Miles</td>
      <td>james@abcd.com</td>
      <td>9876543210</td>
      <td>email</td>
    </tr>
    <tr>
      <td>John</td>
      <td>Paul</td>
      <td>john@abcd.com</td>
      <td>9638527410</td>
      <td>phone</td>
    </tr>
    <tr>
      <td>Math</td>
      <td>willams</td>
      <td>Math@abcd.com</td>
      <td>99873210456</td>
      <td>phone</td>
    </tr>
  </tbody>
</table>
Run Code Online (Sandbox Code Playgroud)

在此表中有Save Button.

<input type="button" id="txt" value="Save" />
Run Code Online (Sandbox Code Playgroud)

按钮代码

function tableToJson(table) {
  var data=[];
  var headers=[];
  for (var i=0;
  i < table.rows[0].cells.length;
  i++) {
    headers[i]=table.rows[0].cells[i].innerHTML.toLowerCase().replace(/ /gi, '');
  }
  for (var i=1;
  i < table.rows.length;
  i++) {
    var tableRow=table.rows[i];
    var rowData= {}
    ;
    for (var j=0;
    j < tableRow.cells.length;
    j++) {
      rowData[headers[j]]=tableRow.cells[j].innerHTML;
    }
    data.push(rowData);
  }
  return data;
}
Run Code Online (Sandbox Code Playgroud)

当点击保存按钮,HTML表格数据将存储中的.txt文件中没有<table>,<tr>,<td>.数据存储格式如下格式.

(James,Miles,james@abcd.com,9876543210,email),
(John,Paul,john@abcd.com,9638527410,phone),
(Math,willams,Math@abcd.com,99873210456,phone)
Run Code Online (Sandbox Code Playgroud)

luu*_*005 6

比上述答案稍微清晰的代码适用于任意数量的列

var retContent = [];
var retString = '';
$('tbody tr').each(function (idx, elem)
{
  var elemText = [];
  $(elem).children('td').each(function (childIdx, childElem)
  {
    elemText.push($(childElem).text());
  });
  retContent.push(`(${elemText.join(',')})`);
});
retString = retContent.join(',\r\n');
Run Code Online (Sandbox Code Playgroud)

jsfiddle与完整的代码