我想导出<a>使用 DataTables 中的单元格内的标签或链接pdfhtml5.
截至目前，该链接显示为纯文本。如何打印它（包括其格式）？
这是一个两步过程：
Step 1
使用数据表exportOptions.format函数将完整的 HTML 文本传递给 PDF 制作者（而不仅仅是传递内部文本）。
exportOptions: {
format: {
body: function ( inner, rowidx, colidx, node ) {
console.log( "in format" );
return inner;
}
}
}
Step 2
处理 PDF 文档，转换为 HTML<a>标记为PDF建立链接.
您可以使用数据表customize为此功能。
customize: function ( doc ) {
processDoc(doc);
}
The processDoc下面的可运行演示中提供了上面引用的函数。它使用 JavaScript 从 HTML 中提取链接并显示文本。它还添加了一些样式，使最终结果看起来更像是可点击的链接。
$(document).ready(function() {
var table = $('#example').DataTable( {
dom: 'Brftip',
buttons: [
{
extend: 'pdfHtml5',
exportOptions: {
format: {
body: function ( inner, rowidx, colidx, node ) {
return inner;
}
}
},
customize: function ( doc ) {
processDoc(doc);
}
}
]
} );
} );
function processDoc( doc ) {
let tableBody = doc.content[1].table.body;
tableBody.forEach(function( row ) {
row.forEach(function( cell ) {
let cellText = cell.text;
if (cellText.startsWith( '<a href=' )) {
let textStart = cellText.indexOf(">") +1;
let textEnd = cellText.indexOf("<", textStart);
let text = cellText.substring(textStart, textEnd);
let linkStart = cellText.indexOf("\"") +1;
let linkEnd = cellText.indexOf("\"", linkStart);
let link = cellText.substring(linkStart, linkEnd);
cell.text = text;
cell.link = link;
cell.color = '#1a0dab';
cell.decoration = 'underline';
}
});
});
}<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Demo</title>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.12.1/css/jquery.dataTables.css"/>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/buttons/2.2.3/css/buttons.dataTables.css"/>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.6.0.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/pdfmake.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/vfs_fonts.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.12.1/js/jquery.dataTables.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/2.2.3/js/dataTables.buttons.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/2.2.3/js/buttons.html5.js"></script>
<link rel="stylesheet" type="text/css" href="https://datatables.net/media/css/site-examples.css">
</head>
<body>
<div style="margin: 20px;">
<table id="example" class="display dataTable cell-border" style="width:100%">
<thead>
<tr>
<th>Name</th>
<th>Position</th>
<th>Office</th>
</tr>
</thead>
<tbody>
<tr>
<td>Tiger Nixon</td>
<td>System Architect</td>
<td><a href="https://en.wikipedia.org/wiki/Edinburgh">Edinburgh</a></td>
</tr>
<tr>
<td>Donna Snider</td>
<td>Customer Support</td>
<td><a href="https://en.wikipedia.org/wiki/New_York_City">New York</a></td>
</tr>
</tbody>
</table>
</div>
</body>
</html>上述演示的最终结果 PDF 如下所示：
注意：如果您不想处理其他列中的其他 HTML，那么您可能需要优化您的body函数 - 所以，类似：
if ($(node).children('a').length > 0) {
return whatever you need here;
} else {
return inner;
}
后续问题（来自评论）：
如果一个单元格中有多个链接怎么办？我怎样才能导出它？
是的，您可以通过多种方式做到这一点。
由于您已经在使用 jQuery（用于 DataTables），因此您可以使用 jQuery 的parseHTML()功能。这会将 HTML 字符串（作为文本）转换为相关 HTML 节点的数组。
然后，您可以迭代该数组以一次处理每个链接（并且还处理可能位于同一数据单元格中的任何其他文本）。
一个基本的例子：
我们假设一个 DataTable 单元格包含以下内容：
Some text <a href="whateverA">Edinburgh</a> and then <a href="whateverB">New York</a> the end.
The parseHTML()函数会将其拆分为一个包含以下 5 个单独节点的数组 - 然后您可以将其作为 5 个单独的字符串进行处理：
Some text
<a href="whateverA">Edinburgh</a>
and then
<a href="whateverB">New York</a>
the end.
这是一个演示：
let str = 'Some text <a href="whateverA">Edinburgh</a> and then <a href="whateverB">New York</a> the end.'
let nodes = $.parseHTML( str );
nodes.forEach(function( node ) {
if ( node.nodeType === Node.TEXT_NODE ) {
console.log( node.data ); // handle as PDF plain string
} else {
console.log( node.outerHTML ); // handle as PDF link
}
})<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>New tab</title>
<script src="https://code.jquery.com/jquery-3.6.0.js"></script>
</head>
<body>
<div>See the results in the console, below.</div>
</body>
</html>最后步骤：
现在，您需要创建一个包含 5 个 PDF 元素的数组，而不是创建仅包含单个 PDF 格式链接的 PDF 单元格（请参阅示例）here)，并将该数组添加到单元格中。
myPdfCellContent: [
'Some text ',
{ text: 'Edinburgh', link: 'whateverA' },
' and then ',
{ text: 'New York', link: 'whateverB' },
' the end.'
]
您可以将此方法集成到现有的 DataTables 解决方案中，以处理一个单元格中的多个链接。