javascript - 如何将 HTML 转换为字符串以在 JavaScript 中生成 PDF?
问题描述
我想将我的 HTML DOM 元素转换为字符串,以便可以将其用于 Pdf 生成。
我在 JavaScript 中尝试了以下代码,但它返回了一个 HTML 元素。
function getHtmlString() {
var element=document.getElementById("pdfdiv");
var str = element.innerHTML;
console.log(str);
return str;
};
<div id="pdfdiv">
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<!--<h3 style="margin-left:150px;"><strong> Patient Details</strong></h3>-->
<table width="100%" style="padding:0px 105px">
<thead>
<tr>
<th>
</th>
</tr>
<tr>
<th>
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<table style="float:left" width="75%">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>
"Hi" @order.Id
</td>
<td>
<h2><strong> Patient Order</strong></h2>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</body>
</html>
</div>
这将返回以下内容:
<!--!-->
<html><!--!-->
<!--!-->
<meta charset="utf-8">
<title></title>
<body><!--!-->
<table width="100%" style="padding:0px 105px"><!--!-->
<!--!--><thead>
<tr>
<th>
</th>
</tr>
<tr>
<th>
</th>
</tr>
</thead>
<tbody><!--!-->
<tr><!--!-->
<td><!--!-->
<table style="float:left" width="75%"><!--!-->
<!--!--><thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody><!--!-->
<tr><!--!-->
<td><!--!-->
"Hi" 4<!--!-->
</td><!--!-->
<!--!--><td>
<h2><strong> Patient Order</strong></h2>
</td>
</tr><!--!-->
</tbody><!--!-->
</table><!--!-->
</td><!--!-->
</tr><!--!-->
</tbody><!--!-->
</table><!--!-->
</body><!--!-->
因此,我无法通过将此字符串传递给PdfDocument document = htmlConverter.Convert(htmlstring);
. 它抛出一个异常Error: Syncfusion.Pdf.PdfException: Html conversion failed
。如何将 HTML DOM 元素转换为字符串?
解决方案
通过设置 JavaScript 的方式,您的代码实际上正在返回一个字符串。
在这里看到:
var element=document.getElementById("pdfdiv");
var str = element.innerHTML;
console.log(str)
console.log("The variable type is...")
console.log(typeof(str))
<div id="pdfdiv">Make me into a string, please!</div>
解决方案很可能在于您似乎正在使用的库:Syncfusion。根据文档,该Convert()
函数将 URL 作为参数,而不是 HTML 字符串。这就是导致程序抛出错误的原因。
我建议列出您在代码中使用的所有库,以便将来在 StackOverflow 上提出问题。
推荐阅读
- php - PHP array add an extra same-array
- c - 在“for”中忽略“if”条件
- django - Django modal Submit form with foreign key not working
- php - show custom text for products with specific woo commerce category
- javascript - 莫里斯图-> html 将变量传递给 php
- python - 在Python中的列表列表中搜索字符串列表的完全匹配
- c++ - Why deconstructor fun 2 times?
- ios - 使用两个字符串生成和读取 QR
- vb.net - How to count unique characters in a string?
- reactjs - React Link changes URL but does not render page