去掉CSDN博客网页上多余的内容并保存为pdf

从这里来的:https://blog.csdn.net/while_black/article/details/90201958
还有这:https://www.jerrycoding.com/article/csdn-print/
在谷歌浏览器中打开的网页本来的样子
去掉CSDN博客网页上多余的内容并保存为pdf_第1张图片
按F12,在右上角选console,复制粘贴,再回车

(function(){
$("#side").remove();
$("#comment_title, #comment_list, #comment_bar, #comment_form, .announce, #ad_cen, #ad_bot").remove();
$(".nav_top_2011, #header, #navigator").remove();
$(".p4course_target, .comment-box, .recommend-box, #csdn-toolbar, #tool-box").remove();
$("aside").remove();
$(".tool-box").remove();
$(".more-toolbox").remove();
$(".csdn-side-toolbar").remove();
$("#main").css('width',$('body').width()-60);
window.print();
})();

弹出的打印预览如下,左边的一部分不见了
去掉CSDN博客网页上多余的内容并保存为pdf_第2张图片
刷新一下网页,在console按一下向上的按键,再回车,这下弹出的打印预览正常些了,也不知道为啥,这下保存成pdf就比较正常了。
去掉CSDN博客网页上多余的内容并保存为pdf_第3张图片
上面的貌似又不好使了,还好这里有
将几个常用网站页面保存为PDF并删除网页无用部分

(function(){
	'use strict';
	var articleBox = $("div.article_content");
	articleBox.removeAttr("style");
	$("#btn-readmore").parent().remove();
	$("#side").remove();
	$("#comment_title, #comment_list, #comment_bar, #comment_form, .announce, #ad_cen, #ad_bot").remove();
	$(".nav_top_2011, #header, #navigator").remove();
	$(".csdn-side-toolbar,.template-box,.reward-user-box").remove();
	$(".p4course_target, .comment-box, .recommend-box, #csdn-toolbar, #tool-box,#dmp_ad_58, .more-toolbox, .article-info-box, .btn-readmore").remove();
	$("aside").remove();
	$(".tool-box").remove();
    $(".pub-footer-new").remove();
	$("main").css('display','content'); 
	$("main").css('float','left'); 
	$("#mainBox").css('width','100%');		
    $(".main_father.clearfix.d-flex.justify-content-center").css("width","100%");   
})();

你可能感兴趣的:(去掉CSDN博客网页上多余的内容并保存为pdf)