将 CSDN 的文章保存成 PDF 文件

最新推荐文章于 2025-03-14 11:14:10 发布

张学徒

最新推荐文章于 2025-03-14 11:14:10 发布

阅读量2k

点赞数 11

分类专栏： JS 文章标签： html jquery

本文链接：https://blog.csdn.net/qq_37280924/article/details/116331740

版权

JS 专栏收录该内容

4 篇文章

订阅专栏

本文介绍了一种使用JavaScript来优化网页打印效果的方法，包括调整页面布局、去除多余元素及设置打印样式等步骤，使得打印出的文档更加整洁。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

文档页面按下 F12

在这里插入图片描述

点击 Console
在这里插入图片描述
在下面输入以下代码

// 将主要内容移动到 body
$("body").prepend($("main"));

// 移除掉body中的其他节点
// 不移除脚本和 style 是因为要保持样式
$.each($("body").children(), function(index, obj) {
    var tag = obj.tagName;
    if (!(tag=="MAIN" || tag=="SCRIPT" || tag=="STYLE")) {
        obj.remove();
    } 
});

// 内容宽度为页面的100% 
$("main").css("width", "100%");
// 移除掉用户信息工具栏
$("#toolBarBox").remove();

// 进行打印，保存PDF
// 设置 500 毫秒等待时间是因为要等待页面设置完成
// 否则页面可能会有部分样式没有加载出来
setTimeout(function(){window.print()}, 500);