javascript - 无法读取未定义的属性 'replace'(在克隆的 html 表上)

Question

我正在尝试将 HTML 表格导出到 Excel 文件。不应导出任何隐藏的列。

以下作品:

var table_div = document.getElementById('MyTable');
$(table_div).find('[style*="display: none"]').remove();

var table_html = table_div.outerHTML.replace(/ /g, '%20');

但是当我导出时，所有隐藏的列都会从我的表中删除。

我尝试在删除隐藏列之前克隆表格:

var table_div = document.getElementById('MyTable');
var cloned_table_div = $(table_div).clone().find('[style*="display: none"]').remove();

var table_html = cloned_table_div.outerHTML.replace(/ /g, '%20');

但这会在 chrome 中出现错误“无法读取未定义的属性‘替换’”。我尝试检查一下 cloned_table_div.outerHTML 是否未定义，它似乎是。我做错了什么？

Answer 1

1. 函数 .find(...) 和 .remove() 不返回克隆表。他们返回 jQuery object ，不是 Element .
2. 获得Element来自jQuery object , 你应该 jQuery .get() .

var table_div = document.getElementById('MyTable');
var cloned_table_div = $(table_div).clone();
cloned_table_div.find('[style*="display: none"]').remove();

var table_html = cloned_table_div.get(0).outerHTML.replace(/ /g, '%20');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="MyTable">
    <span style="display: none"></span>
</div>