Javascript 将html表格导出为excel工作表，不包括隐藏元素

我正在尝试将html表格导出为excel。这个html表有一些隐藏属性，我想在导出表时删除它们。所以我在下面试了一下

if ('undefined' !== typeof module) {

    module.exports = function initExport() {
        var data_type = 'data:application/vnd.ms-excel';;

        $('table *:hidden').attr('data-todelete', 'true');
        var clonedItem = $($('table').html());
        $('table *:hidden').removeAttr('data-todelete');
        clonedItem.find('*:hidden').remove();

        var a = document.createElement('a');
        a.href = data_type + ', ' + clonedItem.wrap("<div />").parent().html();
        a.download = 'exported_table_' + Math.floor((Math.random() * 9999999) + 1000000) + '.xls';
        a.click();

    }
}

而不是

a.href = data_type + ', ' + clonedItem.html();

下面是excel，这是我想要导出的HTML结构

        <thead _ngcontent-xbe-0="">
   <tr _ngcontent-xbe-0="" role="row">
      <th _ngcontent-xbe-0="" class="sorting_disabled" rowspan="1" colspan="1" style="width: 9px;">#</th>
      <th _ngcontent-xbe-0="" class="sorting_disabled" rowspan="1" colspan="1" style="width: 63px;">Departure Airport</th>
      <th _ngcontent-xbe-0="" class="sorting_disabled" rowspan="1" colspan="1" style="width: 72px;">Destination Airport</th>
      <th _ngcontent-xbe-0="" class="sorting_disabled" rowspan="1" colspan="1" style="width: 56px;">Modified Time</th>
      <th _ngcontent-xbe-0="" class="sorting_disabled" rowspan="1" colspan="1" style="width: 69px;">Availability</th>
      <th _ngcontent-xbe-0="" class="sorting_disabled" rowspan="1" colspan="1" style="width: 54px;">Duration</th>
      <th _ngcontent-xbe-0="" class="sorting_disabled" rowspan="1" colspan="1" style="width: 63px;">Departure Date</th>
      <th _ngcontent-xbe-0="" class="sorting_disabled" rowspan="1" colspan="1" style="width: 24px;">Pax</th>
      <th _ngcontent-xbe-0="" class="sorting_disabled" rowspan="1" colspan="1" style="width: 33px;">Total Price</th>
      <th _ngcontent-xbe-0="" class="sorting_disabled" rowspan="1" colspan="1" style="width: 48px;">Time(Hours)</th>
      <th _ngcontent-xbe-0="" class="sorting_disabled" rowspan="1" colspan="1" style="width: 47px;">Expired Time</th>
      <th _ngcontent-xbe-0="" class="sorting_disabled" rowspan="1" colspan="1" style="width: 59px;">Last Possible Price Changed Time</th>
   </tr>
</thead>

<tbody _ngcontent-xbe-0="">

   <tr _ngcontent-xbe-0="">
      <td _ngcontent-xbe-0="">1</td>
      <td _ngcontent-xbe-0="">ASD</td>
      <td _ngcontent-xbe-0="">ABC</td>
      <td _ngcontent-xbe-0="">2017-06-05 12:34:44</td>
      <td _ngcontent-xbe-0="" style="text-align: center;">true</td>
      <td _ngcontent-xbe-0="" style="text-align: center;">13</td>
      <td _ngcontent-xbe-0="">2017-07-31</td>
      <td _ngcontent-xbe-0="">1_0_0</td>
      <td _ngcontent-xbe-0="" style="text-align: right;">143.01</td>
      <td _ngcontent-xbe-0="" style="text-align: right;">1.00</td>
      <td _ngcontent-xbe-0="" style="text-align: center;">2017-06-05 13:34:44</td>
      <td _ngcontent-xbe-0="" style="text-align: center;">2017-06-05 12:34:44</td>
   </tr>

   <!--data-->


</tbody>

#
出发机场
目的地机场
修正时间
可利用性
期间
离港日
圣像牌
总价
时间（小时）
过期时间
最后可能的价格变化时间
1.
自闭症
基础知识
2017-06-05 12:34:44
真的
13
2017-07-31
1_0_0
143.01
1
2017-06-05 13:34:44
2017-06-05 12:34:44

如有任何建议，我们将不胜感激

---

谢谢

我没有真正删除您的

数据

，您似乎没有使用它

尝试使用

.clone（）

JQuery函数：

if (module != null) {

    module.exports = function initExport() {
        var data_type = 'data:application/vnd.ms-excel';;

        $('table *:hidden').attr('data-todelete', 'true');
        var clonedItem = $('table').clone();
        $('table *:hidden').removeAttr('data-todelete');
        $('[data-todelete]',clonedItem).remove();

        var a = document.createElement('a');
        a.href = data_type + ', ' + clonedItem.html();
        a.download = 'exported_table_' + Math.floor((Math.random() * 9999999) + 1000000) + '.xls';
        a.click();

    }
}

---

我测试了自己的函数，将一个表保存到XLS文件，它与您的表结构配合良好：

然后excel包含html代码为#…您能告诉我您要导出的表的html结构吗？首先，您缺少一个标记。午饭后我会更深入地研究这个问题。我测试了我自己的旧函数，用于将表导出到XLS，它可以工作。请参阅我答案中的JSFIDLE。

        <thead _ngcontent-xbe-0="">
   <tr _ngcontent-xbe-0="" role="row">
      <th _ngcontent-xbe-0="" class="sorting_disabled" rowspan="1" colspan="1" style="width: 9px;">#</th>
      <th _ngcontent-xbe-0="" class="sorting_disabled" rowspan="1" colspan="1" style="width: 63px;">Departure Airport</th>
      <th _ngcontent-xbe-0="" class="sorting_disabled" rowspan="1" colspan="1" style="width: 72px;">Destination Airport</th>
      <th _ngcontent-xbe-0="" class="sorting_disabled" rowspan="1" colspan="1" style="width: 56px;">Modified Time</th>
      <th _ngcontent-xbe-0="" class="sorting_disabled" rowspan="1" colspan="1" style="width: 69px;">Availability</th>
      <th _ngcontent-xbe-0="" class="sorting_disabled" rowspan="1" colspan="1" style="width: 54px;">Duration</th>
      <th _ngcontent-xbe-0="" class="sorting_disabled" rowspan="1" colspan="1" style="width: 63px;">Departure Date</th>
      <th _ngcontent-xbe-0="" class="sorting_disabled" rowspan="1" colspan="1" style="width: 24px;">Pax</th>
      <th _ngcontent-xbe-0="" class="sorting_disabled" rowspan="1" colspan="1" style="width: 33px;">Total Price</th>
      <th _ngcontent-xbe-0="" class="sorting_disabled" rowspan="1" colspan="1" style="width: 48px;">Time(Hours)</th>
      <th _ngcontent-xbe-0="" class="sorting_disabled" rowspan="1" colspan="1" style="width: 47px;">Expired Time</th>
      <th _ngcontent-xbe-0="" class="sorting_disabled" rowspan="1" colspan="1" style="width: 59px;">Last Possible Price Changed Time</th>
   </tr>
</thead>

<tbody _ngcontent-xbe-0="">

   <tr _ngcontent-xbe-0="">
      <td _ngcontent-xbe-0="">1</td>
      <td _ngcontent-xbe-0="">ASD</td>
      <td _ngcontent-xbe-0="">ABC</td>
      <td _ngcontent-xbe-0="">2017-06-05 12:34:44</td>
      <td _ngcontent-xbe-0="" style="text-align: center;">true</td>
      <td _ngcontent-xbe-0="" style="text-align: center;">13</td>
      <td _ngcontent-xbe-0="">2017-07-31</td>
      <td _ngcontent-xbe-0="">1_0_0</td>
      <td _ngcontent-xbe-0="" style="text-align: right;">143.01</td>
      <td _ngcontent-xbe-0="" style="text-align: right;">1.00</td>
      <td _ngcontent-xbe-0="" style="text-align: center;">2017-06-05 13:34:44</td>
      <td _ngcontent-xbe-0="" style="text-align: center;">2017-06-05 12:34:44</td>
   </tr>

   <!--data-->


</tbody>

if (module != null) {

    module.exports = function initExport() {
        var data_type = 'data:application/vnd.ms-excel';;

        $('table *:hidden').attr('data-todelete', 'true');
        var clonedItem = $('table').clone();
        $('table *:hidden').removeAttr('data-todelete');
        $('[data-todelete]',clonedItem).remove();

        var a = document.createElement('a');
        a.href = data_type + ', ' + clonedItem.html();
        a.download = 'exported_table_' + Math.floor((Math.random() * 9999999) + 1000000) + '.xls';
        a.click();

    }
}