如何在 JavaScript 中将 HTML 转换为 PDF 生成的字符串？

Question

I want to convert my HTML DOM element to a string so that I can use it for Pdf generation.我想将我的 HTML DOM 元素转换为字符串，以便可以将其用于 Pdf 生成。

I tried the following code in JavaScript but it returns an HTML element.我在 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>

This returns the following:这将返回以下内容：

<!--!-->
<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><!--!-->

Due to this, I can't covert to PDF by passing this string to PdfDocument document = htmlConverter.Convert(htmlstring);因此，我无法通过将此字符串传递给PdfDocument document = htmlConverter.Convert(htmlstring); . . It throws an exception of Error: Syncfusion.Pdf.PdfException: Html conversion failed .它抛出异常Error: Syncfusion.Pdf.PdfException: Html conversion failed 。 How can I convert the HTML DOM element to a string?如何将 HTML DOM 元素转换为字符串？

Answer 1

With the way that your JavaScript is set up, your code actually is returning a string.通过设置 JavaScript 的方式，您的代码实际上正在返回一个字符串。

Seen here:在这里看到：

 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>

The solution most likely lies in the library you appear to be using: Syncfusion .解决方案很可能在于您似乎正在使用的库： Syncfusion 。 According to the documentation, the Convert() function takes a URL as a parameter, not an HTML string.根据文档， Convert() function 将 URL 作为参数，而不是 HTML 字符串。 This is what's leading the program throwing an error.这就是导致程序抛出错误的原因。

I'd recommend listing all the libraries you're using in your code for future questions asked on StackOverflow.我建议列出您在代码中使用的所有库，以便将来在 StackOverflow 上提出问题。

Answer 2

The reported exception in the HTML converter may occur due to converting HTML string in a URL conversion method.由于在 URL 转换方法中转换 HTML 字符串，可能会出现 HTML 转换器中报告的异常。 The convert method with a single argument is for URL to PDF conversion.带有单个参数的 convert 方法用于 URL 到 PDF 的转换。 Kindly refer to the below code snippet for converting HTML string to PDF.请参考以下代码片段，将 HTML 字符串转换为 PDF。 Kindly try the conversion with the below code snippet and let us know the result.请尝试使用以下代码片段进行转换，并让我们知道结果。

//Convert HTML string to PDF  
PdfDocument document = htmlConverter.Convert(htmlText, baseUrl);

Please refer below links for more information,请参阅以下链接以获取更多信息，

UG : https://help.syncfusion.com/file-formats/pdf/convert-html-to-pdf/webkit#html-string-to-pdf UG : https://help.syncfusion.com/file-formats/pdf/convert-html-to-pdf/webkit#html-string-to-pdf

KB : https://www.syncfusion.com/kb/9890/how-to-convert-html-string-to-pdf-using-c-and-net知识库： https://www.syncfusion.com/kb/9890/how-to-convert-html-string-to-pdf-using-c-and-net

https://www.syncfusion.com/kb/8174/how-to-preserve-resources-during-html-string-to-pdf-conversion https://www.syncfusion.com/kb/8174/how-to-preserve-resources-during-html-string-to-pdf-conversion

Note : I work for Syncfusion.注意：我为 Syncfusion 工作。

如何在 JavaScript 中将 HTML 转换为 PDF 生成的字符串？

问题描述

2 个解决方案

解决方案1
0 2020-04-23 19:02:53

解决方案2
0 已采纳 2020-04-30 12:06:10

如何在 JavaScript 中将 HTML 转换为 PDF 生成的字符串？

问题描述

2 个解决方案

解决方案1 0 2020-04-23 19:02:53

解决方案2 0 已采纳 2020-04-30 12:06:10

解决方案1
0 2020-04-23 19:02:53

解决方案2
0 已采纳 2020-04-30 12:06:10