使用 javascript 导出表时剥离 HTML 标签

Question

我需要将数据表导出到 excel csv 文件中。 但是当我导出表格时，excel 数据带有 HTML 标签，例如数据表中的标签或其他任何内容。 它实际上是一个来自 github 的名为“leantime”的开源项目。我尝试了很多。 但我找不到与此问题相关的任何内容。 如果我导出文件，下面提到的示例将是列数据。 <a class="ticketModal" href="http://localhost/pmt/tickets/showTicket/20#subtasks">test task - TEST ASSIGNER | Plan Hrs:2 | Hrs Left: 4</a>

检查 javascript 代码，并建议我一个代码来剥离 html 标签

DataTable.ext.buttons.csvHtml5 = {
        bom: !1,
        className: "buttons-csv buttons-html5",
        available: function() {
            return window.FileReader !== undefined && window.Blob
        },
        text: function(dt) {
            return dt.i18n("buttons.csv", "CSV")
        },
        action: function(e, dt, button, config) {
            this.processing(!0);
            var output = _exportData(dt, config).str,
                info = dt.buttons.exportInfo(config),
                charset = config.charset;
            config.customize && (output = config.customize(output, config, dt)), charset = !1 !== charset ? (charset = charset || document.characterSet || document.charset) && ";charset=" + charset : "", config.bom && (output = String.fromCharCode(65279) + output), _saveAs(new Blob([output], {
                type: "text/csv" + charset
            }), info.filename, !0), this.processing(!1)
        },
        filename: "*",
        extension: ".csv",
        exportOptions: {
            
        },
        fieldSeparator: ",",
        fieldBoundary: '"',
        escapeChar: '"',
        charset: null,
        header: !0,
        footer: !1
    }

我希望我导出的 csv 文件只包含一个纯数据（没有 html 标签）。 给我想法更改代码以防止文件中的 html 标签

Answer 1

我不熟悉数据表。 您需要遍历每一行和单元格，并将单元格 HTML 文本转换为纯文本。

您可以使用此 function 从 HTML 文本中删除 HTML：

    /**
     * Strip HTML and return an escaped text string for use in HTML attribute, such as title
     *
     * @param {String} HTML str
     */
    const htmlToText = function (str) {
      return str
        .replace(/\s+/g, ' ')
        .replace(/<\/(p|li|ul|ol)>/gi, ' ')
        .replace(/<(ul|ol|br[ \/]*)>/gi, ' ')
        .replace(/<li>/gi, ' • ')
        .replace(/<[a-z]+[^>]*>/gi, '')
        .replace(/<\/[a-z]+>/gi, '')
        .replace(/\s{2,}/g, ' ')
        .replace(/^\s+/, '')
        .replace(/\s+$/, '');
    };

您还可以添加对 HTML 实体的支持，例如：

        .replace(/&lt;/g, '<')
        .replace(/&gt;/g, '>')
        .replace(/&amp;/g, '&')
        .replace(/&copy;/g, '©')
        .replace(/&reg;/g, '®')
        .replace(/&trade;/g, '™')
        .replace(/&(#(?:x[0-9a-f]+|\d+));/gi, function(m, c1) {
          return String.fromCharCode(c1[1].toLowerCase() === "x"
            ? parseInt(c1.substr(2), 16)
            : parseInt(c1.substr(1), 10)
          );
        })

有一些不受支持的极端情况：

• <h2 title="Use <this>">Use this</h2> -- 属性内不支持未转义的括号，示例应写成<h2 title="Use &lt;this&gt;">Use this</h2>