JavaScript를 사용하여 Div 내의 HTML에서 PDF를 생성하는 방법은 무엇입니까?
- Linda Hamilton원래의
- 2024-12-08 10:51:13653검색
Javascript를 사용하여 div의 HTML에서 PDF 생성
수행해야 할 작업은 div의 콘텐츠를 ID로 변환하는 것입니다. "pdf"를 PDF 문서로 변환합니다. 이 PDF 문서는 "foobar.pdf"라는 파일 이름으로 자동 다운로드되어야 합니다.
jspdf는 PDF 생성에 일반적으로 사용되지만 텍스트 기능 제한으로 인해 문제가 발생합니다. 문자열 값만 허용하지만 HTML 입력은 필수입니다. 이 문제를 해결하려면 jspdf.plugin.from_html.js 및 jspdf.plugin.split_text_to_size.js와 같은 플러그인이 필요합니다. 이러한 플러그인을 사용하여 원하는 결과를 얻는 방법은 다음과 같습니다.
- 필요한 스크립트를 프로젝트에 통합하는 것부터 시작하세요.
jspdf.js jspdf.plugin.from_html.js jspdf.plugin.split_text_to_size.js jspdf.plugin.standard_fonts_metrics.js
- 특정 요소에 필요한 경우 PDF에서 제외하려면 ID를 할당하고 jsPDF의 특수 요소 처리기 내에서 식별해야 합니다. 예를 들어 ID가 "ignorePDF"인 요소를 제외하려면 HTML 코드를 다음과 같이 수정하세요.
<!DOCTYPE html>
<html>
<body>
<p>
- 다음 JavaScript 코드는 PDF를 생성하고 팝업에 표시합니다. window:
var doc = new jsPDF();
var elementHandler = {
'#ignorePDF': function (element, renderer) {
return true;
}
};
var source = window.document.getElementsByTagName("body")[0];
doc.fromHTML(
source,
15,
15,
{
'width': 180,'elementHandlers': elementHandler
});
doc.output("dataurlnewwindow");
이 방법은 "print this to"라는 텍스트가 포함된 PDF를 생성합니다. pdf."
현재 버전에서는 특수 요소 핸들러가 주로 ID를 처리한다는 점에 유의하는 것이 중요합니다. 결과적으로 클래스 선택기(예: '.ignorePDF')를 사용하면 의도한 결과가 생성되지 않습니다.
또한 jsPDF는 CSS 스타일에 대한 지원이 부족하며 텍스트 노드 내의 텍스트만 인쇄합니다. 따라서 텍스트 영역 및 유사한 요소의 값은 PDF에 포함되지 않습니다.
위 내용은 JavaScript를 사용하여 Div 내의 HTML에서 PDF를 생성하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.