【javascript】csdn/cnblogs文章打印：页面简洁

helian147

学习js，有时打印web页面，去除页面无用的部分，搜索参考网上代码，很多要么页面打印不全、要么文字被切。

1. 进入页面，按F12，在console输入以下代码：

cnblogs博客园：

[JavaScript] 纯文本查看 复制代码

(function(){
        'use strict';
        $("#comment_form, #header, #leftmenu, #big_banner, #footer, #blog_post_info_block, #sideBar").remove();
        $("#content").css('margin','0');
        $("body").css('margin','0').css('padding','2px');
        $("#mainContent").css('width','100%');
        window.print();
})();

CSDN：

[JavaScript] 纯文本查看 复制代码

(function(){
        'use strict';
        $(".toolbar-inside, .blog_container_aside, .csdn-side-toolbar , .more-toolbox, .recommend-box insert-baidu-box, .blog-footer-bottom").remove();
        $("main").css('display','content'); 
        $("main").css('float','left'); 
        $("main").width(1080); 
        $("#mainBox").width("100%");                
        window.print();
})();

2. 其他类似，如有改版，页面右键检查要去除的部分，查看源码，按选择器去除相关部分：
.xxx      类选择器，以class=xxx
#xxx    ID选择器，以id=xxx

3. CSDN打印时切文字，因其width设置与打印显示不一致，按下设置：
$("main").width(1080);

Airey

感谢分享~，这个在楼主的基础上删除了csdn评论和推荐

[JavaScript] 纯文本查看 复制代码

(function(){
        'use strict';
        $(".toolbar-inside, .blog_container_aside, .csdn-side-toolbar , .more-toolbox, .recommend-box insert-baidu-box, .blog-footer-bottom, .second-recommend-box recommend-box , .comment-box, .recommend-box insert-baidu-box , .recommend-box, .template-box, .recommend-tit-mod").remove();
        $("main").css('display','content'); 
        $("main").css('float','left'); 
        $("main").width(1080); 
        $("#mainBox").width("100%");                
        window.print();
})();

BIG_huang

不错，有用

Ercilan

打印这个干啥，方便“转载”么纯疑问

shyjeai

打印的时候，它的位置能预览嘛

神仙不在

用不到这个