DataTable 导出数据 -> 自定义 HTML 剥离

Question

我正在尝试使用格式化的 HTML 标签从我的数据表中导出一些数据。我的目标是从单独的数据字段 (data-original-title="xxx") 中提取所有可见文本 (innerhtml) 和工具提示文本。

例如一些数据表行：

<td><span class="text-success"><abbr data-container="body" data-toggle="tooltip" data-placement="bottom" data-html="true" data-original-title="XX: 2.55 (0.00|5.00) <br>YY: -10.15 (-27.96|-9.00)">xx/yy</abbr></span></td>
<td><span class="text-success"><abbr data-container="body" data-toggle="tooltip" data-placement="bottom" data-html="true" data-original-title="<b>section 1</b>: 0, <b>section 2</b>: 0, <b>section 3</b>: 2, <b>section 4</b>: 5, <b>section 5</b>: 1">8</abbr></span></td>

我想要这样的东西：

XX: 2.55 (0.00|5.00) <br>YY: -10.15 (-27.96|-9.00) - xx/yy
section 1: 0, section 2: 0, section 3: 2, section 4: 5, section 5: 1 - 8

默认行为很好，但构建这个（问题：">）：

XX: 2.55 (0.00|5.00) <br>YY: -10.15 (-27.96|-9.00)">xx/yy
section 1: 0, section 2: 0, section 3: 2, section 4: 5, section 5: 1">8

有没有办法在板载 HTML 从数据表中剥离后使用额外的替换？

Answer 1

你可以试试这个：

var buttonCommon = {
        exportOptions: {
            format: {
                body: function ( data, row, column, node ) {

                    title = $(row).data('original-title');
                }
            }
        }
    };

Answer 2

如果有人遇到同样的问题，这是我的解决方案。我无法接受 'data attribute' 答案，因为我的行数据通常有几个 html 级别。

这是我的结果：

format:  {
    // Manipulation der Export Daten
    body: (data, row, column, node) => {
        // Extract tooltip, if available
        const tooltipExtract = (data) => {
            const regex = /(data-original-title=").*?(">)/g
            if (regex.test(data)) {
                const tooltipExtraced = data.match(regex) // Matched Tooltip with html in innertext
                return tooltipExtraced[0].replace(/<[^>"']*((("[^"]*")|('[^']*'))[^"'>]*)*>|(data-original-title=")|">/g, '').trim() // Deletes html tags and the beginning/ending of the tooltip
            }
            return false
        }

        // Extract data
        const innerData = data.replace(/<[^>"']*((("[^"]*")|('[^']*'))[^"'>]*)*>/g, '').trim() // Innertext
        const tooltip = tooltipExtract(data)    // Tooltip

        // Result with or without Tooltip
        if (tooltip) {
            return `${innerData} -> ${tooltip}`
        }
        return innerData
    }
}

DataTable 导出数据 -> 自定义 HTML 剥离

DataTable Export Data -> Customized HTML stripping

javascript

regex

datatable

export