导出带有csv链接的html表

时间:2019-06-23 17:48:35

标签: javascript

我正在使用以下功能将表导出到csv文件中,以便我们的用户将购买的内容导出为可以在快速书,excel等中使用的格式。

该函数很好用,除了表的第一列包含url并且这些列在导出中显示为空白。

我想知道如何修改它,以便当链接作为字段遇到时,该链接的文本会添加到csv中。

示例:<a href="example.php">an example</a>会将an example添加到该字段的csv中。

        function exportTableToCSV($table, filename) {
            var $rows = $table.find('tr:has(td),tr:has(th)'),
            tmpColDelim = String.fromCharCode(11), // vertical tab character
            tmpRowDelim = String.fromCharCode(0), // null character
            colDelim = '","',
            rowDelim = '"\r\n"',
            csv = '"' + $rows.map(function (i, row) {
                var $row = $(row), $cols = $row.find('td,th');
                return $cols.map(function (j, col) {
                    var $col = $(col), text = $col.text();
                    return text.replace(/"/g, '""'); // escape double quotes
                }).get().join(tmpColDelim);
            }).get().join(tmpRowDelim).split(tmpRowDelim).join(rowDelim).split(tmpColDelim).join(colDelim) + '"',
            csvData = 'data:application/csv;charset=utf-8,' + encodeURIComponent(csv);
            console.log(csv);

            if (window.navigator.msSaveBlob) { // IE 10+
                window.navigator.msSaveOrOpenBlob(new Blob([csv],
                {type: "text/plain;charset=utf-8;"}),
                "csvname.csv")
            } else {
                $(this).attr({ 'download': filename, 'href': csvData, 'target': '_blank' });
            }
        }

2 个答案:

答案 0 :(得分:1)

据我所知,您的代码段应该已经支持此功能。它遍历表的所有行,并遍历其所有列字段的每一行,在此应用jQuery的text()函数以提取文本。这也应该返回标签之间的文本。

示例:

console.log($('<td><a href="test.html">Test page</a></td>').text());
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

将返回字符串Test page

This fiddle包含您提供的功能和带有一些锚点元素的虚拟表。我认为它已经满足您的要求。

答案 1 :(得分:0)

var a = document.createElement('a');
a.href = "http://example.php";
a.append("an example"); 
document.body.appendChild(a);

console.log(a.textContent);