选择你喜欢的标签
我们会为你匹配适合你的网址导航

    确认 跳过

    跳过将删除所有初始化信息

    您的位置：0XUCN > 资讯 > 技术
    新闻分类

    Printjs：自定义网页打印功能插件库

    技术 PRO 稿源：前端资源推荐 2024-12-01 21:23

    Print.js 是一个用于在 Web 应用中打印 HTML 文件元素的 JavaScript 库，允许开发者在网页上轻松实现打印功能，可自由修改打印样式，支持四种打印文档类型，包含 PDF、HTML、Image 和 JSON。

    安装使用：

    // 引入 Print.js import printJS from 'print-js' // 打印按钮点击事件 document.getElementById('printButton').addEventListener('click',  function() {   printJS({     printable: 'element-to-print', // 要打印的元素的ID     type: 'html', // 打印类型，这里是HTML     style: 'print.css' // 打印样式表   }); });

    配置项：

    printable：要打印的文档源，可以是 PDF 或图像的 URL、HTML 元素的 ID 或 JSON 数据对象。
    type：可打印类型，可用选项有 pdf、html、image、json 和 raw-html。
    header：打印 HTML、图像或 JSON 时使用的可选标题，将放置在页面顶部，可以接受文本或原始 HTML。
    headerStyle：应用于标题文本的可选样式。
    maxWidth：打印文档的最大宽度（像素）。
    css：要应用到打印的 HTML 的一个或多个 CSS 文件的 URL。
    style：应用于打印的 HTML 的自定义样式字符串。
    scanStyles：当设置为 false 时，库将不处理应用于打印的 HTML 的样式，适用于使用 css 参数时。
    targetStyle：要处理的特定样式数组，例如 ['padding-top', 'border-bottom']。
    targetStyles：与 targetStyle 类似，但处理一系列样式，例如 ['border', 'padding'] 将包括所有相关的边和填充样式。
    ignoreElements：在打印父 HTML 元素时，要忽略的 HTML ID 数组。
    properties：用于打印 JSON 数据时的对象属性名称数组。
    gridHeaderStyle：打印 JSON 数据时，表格头部的可选样式。
    gridStyle：打印 JSON 数据时，表格行的可选样式。
    repeatTableHeader：用于打印 JSON 数据时，设置为 false 时仅在第一页显示数据表头。
    showModal：启用此选项以在检索或处理大型 PDF 文件时显示用户反馈。
    modalMessage：当 showModal 设置为 true 时显示给用户的消息。
    onLoadingStart：当 PDF 正在加载时执行的函数。
    onLoadingEnd：在 PDF 加载完成后执行的函数。
    documentTitle：打印 HTML、图像或 JSON 时显示的文档标题。
    fallbackPrintable：当浏览器不兼容时，用于在新标签页中打开的备用 PDF 文档。
    onPdfOpen：当浏览器不兼容时，PDF 在新标签页中打开时执行的回调函数。
    onPrintDialogClose：浏览器打印对话框关闭后执行的回调函数。
    onError：发生错误时执行的回调函数。
    base64：用于打印作为 base64 数据传递的 PDF 文档。

    功能和特性：

    简单易用：Print.js 的 API 设计简洁直观，即使是对 JavaScript 不太熟悉的开发者也能快速上手。它提供了简单的方法来打印网页内容或任何 DOM 元素。
    跨浏览器支持：Print.js 能够在所有主流浏览器上运行，包括 Chrome、Firefox、Safari、Edge 以及 Internet Explorer，确保了广泛的兼容性。
    灵活的打印选项：Print.js 不仅可以打印整个网页，还可以选择性地打印页面上的特定部分。这使得开发者可以根据需要定制打印内容。
    支持打印样式：Print.js 允许开发者定义打印样式，这意味着你可以为打印输出专门设置样式，而不影响屏幕上的显示效果。
    无依赖性：Print.js 是一个独立的库，不依赖于其他 JavaScript 框架或库，这使得它非常轻便，易于集成到任何项目中。
    易于集成：你可以很容易地将 Print.js 集成到现有的项目中，无论是使用 npm、yarn 还是直接通过 script 标签引入。

    0XU.CN

    [超站]友情链接：

    四季很好，只要有你，文娱排行榜：https://www.yaopaiming.com/
    关注数据与安全，洞悉企业级服务市场：https://www.ijiandao.com/

    *文章为作者独立观点，不代表 0XUCN 立场
    本文由 艾秋发表，转载此文章须经作者同意，并请附上出处(0XUCN)及本页链接。
    原文链接 https://www.0xu.cn/article/intelnet/technology/52009.html
    Printjs 网页打印 JavaScript Print.js
    图库
    .Post.Author.LoginName 艾秋
    公众号 关注网络尖刀微信公众号
    随时掌握互联网精彩
    赞助链接
    百度热搜榜
    排名 热点 搜索指数
    AiDeep Ued
    关于我们 联系我们 网站入库 法律声明 广告服务 侵删通道
    Copyright © 2021 K2CMS All rights reserved.
    蜀ICP备17002406号