其他 | 把 csdn 博客的内容导出成 pdf 文件

背景 :使用 edge浏览器 打印博客资料,出现内容被遮盖、纸张形状奇怪 等问题;换成谷歌浏览器打印同样出现该问题。

尝试:参考文章,在此基础上进行改进,满足可以✔保留内容不遮盖(使内容不会超出页面的边界)、✔修改页边距的、✔保留A4纸张大小,还✔保留代码的高亮。

解决 :谷歌浏览器中 F12 -》控制台输入: "允许粘贴"或"allow pasting" 后 回车 -》以下输入代码(可以直接选择以下 2.改进后的代码)-》跳出打印界面

1. 原始参考代码:

javascript 复制代码
(function doPrint(){      
	'use strict';
	var articleBox = $("div.article_content");
	articleBox.removeAttr("style");
	var head_str = "";       
	var foot_str = "";   
	var older = document.body.innerHTML;       
	var title= document.getElementsByClassName('article-title-box')[0].innerHTML; 
	var main_body = document.getElementsByClassName('article_content')[0].innerHTML;
	document.body.innerHTML = head_str + title + main_body + foot_str;
	$("#mainBox").width("100%");
	document.getElementsByTagName('body')[0].style.zoom=0.8;     
	window.print();
	document.body.innerHTML = older;
	return false;
})();

2. 改进后的代码:

javascript 复制代码
(function doPrint(){       
    'use strict';
    var articleBox = $("div.article_content");
    articleBox.removeAttr("style");

    var older = document.body.innerHTML;       
    var title = document.getElementsByClassName('article-title-box')[0].innerHTML; 
    var main_body = document.getElementsByClassName('article_content')[0].innerHTML;

    // 收集当前页面的所有 <link rel="stylesheet"> 和 <style>
    var styles = "";
    document.querySelectorAll("link[rel='stylesheet'], style").forEach(function(node){
        styles += node.outerHTML;
    });

    // 打印专用样式,保留A4大小
    var printStyles = `
      <style>
        @page {
          size: A4;         /* 指定纸张大小为 A4 */
          margin: 15mm;     /* 页边距可调 */
        }
        body {
          zoom: 0.9;        /* 页面整体缩放 */
        }
        pre, code {
          white-space: pre-wrap !important; 
        }
      </style>
    `;

    var head_str = "<head>" + styles + printStyles + "</head><body>";
    var foot_str = "</body>";

    document.body.innerHTML = head_str + title + main_body + foot_str;

    window.print();

    document.body.innerHTML = older;
    return false;
})();

参考:如何将CSDN文章导出为pdf文件(清爽) - 知乎

ps:书籍的页边距2.5cm,一般打印页边距1.5-2cm。

相关推荐
霸道流氓气质27 分钟前
AI 简历制作平台:结构化输出解析、多模板渲染与 PDF 导出的 Vue3 + Spring AI 全栈实战
人工智能·spring·pdf
开开心心_Every38 分钟前
黄金价格软件国内外价格实时监控超方便
运维·服务器·游戏·智能手机·pdf·lua·perl
JasonSJX1 小时前
DRM-X 5.0 PDF 保护更新:Windows 与 Mac 打印保留用户水印,ZJGet iOS 版支持 PDF 阅读
macos·pdf
shmily麻瓜小菜鸡21 小时前
前端实现图片与PDF文字识别敏感信息打码方案
前端·pdf·状态模式
ComPDFKit1 天前
PDF 涂黑后还能复制?用 ComPDF 检查敏感文字是否真正删除
pdf
飞塔老梅子1 天前
21. 按页数或章节分割大PDF文件 ❀ 老梅子学AI
pdf·分割·basic·pdfsam·裁切
开开心心就好1 天前
文件关联被破坏怎么修?免费工具一键修复
java·服务器·开发语言·pdf·ocr·启发式算法·宽度优先
黄一一9112431 天前
吾爱大佬开发,离线可用!PDF文件处理工具,本地网页版文件-浏览器里就能搞定,所有操作系统可用
windows·安全·阿里云·pdf·.net·开源软件
开开心心就好1 天前
Windows视频播放器推荐,精简版体积更小
java·服务器·开发语言·eclipse·pdf·ocr·音视频
开开心心就好1 天前
A3的PDF怎么切成A4?拖一下分割线就行
服务器·开发语言·python·算法·pdf·ocr·tornado