从 HTML 表导出为 excel 显示带有标记的所有表内容

Export as excel from HTML table shows all the table contents with tags

本文关键字：显示 HTML excel      更新时间：2023-09-26

>我目前在将 html 表转换为 excel 时遇到问题，但每当我检查文件时，它只用一行填充，即带有表格的 HTML 标签。我正在开发的 chrome 扩展有表，但没有 id 和类，所以我使用 table：nth-child（2） 来定位它。

这是我的代码：

var textbox = document.getElementsByName('regular')[0];
console.log(textbox);
    var para = document.createElement("input");
    var t = document.createTextNode("Show Password");
    para.setAttribute("type", "button"); 
    para.setAttribute("id", "btnExport"); 
    para.setAttribute("value","Export Table data into Excel");
    textbox.parentElement.appendChild(para);
$("#btnExport").click(function (e) {
    window.open('data:application/vnd.ms-excel,' + $('table:nth-child(2)').html());
    e.preventDefault();
});

<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>

<script>
    $(document).ready(function () {
        $("#btnExport").click(function (e) {
            window.open('data:application/vnd.ms-excel,' + $('#dvData').html());
            e.preventDefault();
        });
 });  
</script>
</head>
<body>
    <input type="button" id="btnExport" value="Export" />
    <div id="dvData">
    <table>
        <tr>
            <th>Column One</th>
            <th>Column Two</th>
            <th>Column Three</th>
        </tr>
        <tr>
            <td>row1 Col1</td>
            <td>row1 Col2</td>
            <td>row1 Col3</td>
        </tr>
        <tr>
            <td>row2 Col1</td>
            <td>row2 Col2</td>
            <td>row2 Col3</td>
        </tr>
        <tr>
            <td>row3 Col1</td>
            <td>row3 Col2</td>
            <td><a href="http://www.jquery2dotnet.com/">http://www.jquery2dotnet.com/</a>
            </td>
        </tr>
    </table>
</div>

</body>
</html>
相关文章：