www.久久久久|狼友网站av天堂|精品国产无码a片|一级av色欲av|91在线播放视频|亚洲无码主播在线|国产精品草久在线|明星AV网站在线|污污内射久久一区|婷婷综合视频网站

當(dāng)前位置：首頁 > 公眾號(hào)精選 > TsinghuaJoking

如何打印比賽規(guī)則？

時(shí)間：2021-11-15 14:49:43
手機(jī)看文章

掃描二維碼
隨時(shí)隨地手機(jī)看文章

[導(dǎo)讀]簡介：根據(jù)生成文檔的需要，在CSDN上尋找一些介紹將MARKDOWN文檔生成PDF博文。根據(jù)他們介紹的方法，測試打印的效果。特別是對于CSDN新增加的一些顯示元素的清理，可以生成更加干凈完整的PDF文檔。關(guān)鍵詞：MarkDown，CSDN，PDF01CSDN→PDF一、CSDN的...


簡 介： 根據(jù)生成文檔的需要，在CSDN上尋找一些介紹將MARKDOWN文檔生成PDF博文。根據(jù)他們介紹的方法，測試打印的效果。特別是對于CSDN新增加的一些顯示元素的清理，可以生成更加干凈完整的PDF文檔。
關(guān)鍵詞： MarkDown，CSDN，PDF


01 CSDN→PDF

一、CSDN的Markdown編輯器

CSDN的Markdown編輯器功能強(qiáng)大，可以包含豐富的內(nèi)容（文字、公式、圖片、動(dòng)圖、表格、流程圖、程序代碼、影片等等）?；谠摼庉嬈?，常用來：


  • 編輯微信內(nèi)容，然后再借助于 mdnice[1] 外部套一個(gè)馬甲生成微信推文；特別是CSDN允許直接圖片粘貼存儲(chǔ)圖片。


  • 記錄平時(shí)實(shí)驗(yàn)研究工作，得益于Markdown文檔可以很方便將實(shí)驗(yàn)程序、數(shù)據(jù)、圖片以及動(dòng)圖進(jìn)行記錄。


  • 記錄智能車競賽相關(guān)工作。CSDN博文審查非常迅速，而且7/24，便于及時(shí)整理同學(xué)們反饋意見對相關(guān)文檔進(jìn)行修改發(fā)布，幾乎可以達(dá)到實(shí)時(shí)。


昨天在CSDN上整理發(fā)布的 智能車競賽比賽規(guī)則（討論稿）[2] 快速根據(jù)同學(xué)們的反饋進(jìn)行修改和迭代。


二、Markdown文件轉(zhuǎn)成PDF

對于需要閱讀文獻(xiàn)，總是聯(lián)網(wǎng)在CSDN網(wǎng)頁上閱讀還是不太方便。如果將其轉(zhuǎn)換成PDF文檔，進(jìn)行打印和閱讀則更加方便。


現(xiàn)在在CSDN的MarkDown編輯器只支持輸出 Markdown文件和HTML文件，還不支持輸出Word， PDF文件。如果將其Markdown文件下載，在第三方MD編輯器進(jìn)行編輯和顯示，會(huì)丟失一些CSDN的Markdown的特性，一些公式的顯示，流程圖的繪制等都會(huì)消失。


根據(jù)CSDN多篇博文介紹的方案，利用Chrome瀏覽器本身調(diào)試功能將Markdown文檔生成PDF文件。下面是相關(guān)的博文：


  • 新CSDN文章轉(zhuǎn)成PDF、打印(去空白)


  • 如何將CSDN文章內(nèi)容轉(zhuǎn)成PDF[3]


  • CSDN博客轉(zhuǎn)存為PDF[4]


三、PDF轉(zhuǎn)換過程

這些方法都大體遵循相同的過程。


1、打開Chrome開發(fā)者工具

可以直接在Chome界面通過快捷鍵  ctrl shift I打開Chrome的開發(fā)者工具界面?；蛘咄ㄟ^瀏覽器右上角（豎著三個(gè)點(diǎn)）菜單中的 更多工具 下的 開發(fā)者工具 開打開發(fā)者工具界面。如下圖所示：


▲ 圖1.3.1  打開Chrome開發(fā)者工具

2、在Console界面下粘貼代碼

在開發(fā)者界面點(diǎn)擊“console”頁，在下面輸入?yún)^(qū)粘貼代碼。


（1）點(diǎn)擊“Console”

▲ 圖1.3.2 點(diǎn)擊Console，然后粘貼代碼

（2）粘貼代碼

針對CSDN頁面打印，粘貼下面的代碼。


(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, #blogColumnPayAdvert, #toolBarBox, #csdn-copyright-footer").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();
$("main").css('display','content');
$("main").css('float','left');
$("#mainBox").css('width','90%');
$(".main_father.clearfix.d-flex.justify-content-center").css("width","90%"); //顯示不全關(guān)鍵在于修改這里的width的比例
window.print();                  // 修改成 90% 基本就可以顯示全
})();
該代碼的主要功能：


  • 精簡CSDN網(wǎng)頁，只剩下中間部分顯示區(qū)；
  • 生成主顯示區(qū)，設(shè)置顯示區(qū)所占頁面寬度；
  • 打開頁面打印顯示對話框；
在TEASOFT命令環(huán)境下，輸入“cdpdf”便可以在Windows的前切板中生成上述代碼，只要在console輸入?yún)^(qū)使用CTRL V即可將代碼輸入。使用“回車”鍵，便可以執(zhí)行上述代碼。


3、頁面打印對話框

代碼執(zhí)行后，便可以彈出打印預(yù)覽對話框。在彈出的打印預(yù)覽對話框中：


  • 選擇目標(biāo)打印機(jī)：另存為PDF
  • 設(shè)置頁面與布局；
  • 在更多設(shè)置中，定義紙張尺寸，工作表格頁數(shù)以及邊距；
  • 更重要的是將“頁眉和頁腳”、“背景圖形”都去掉。
▲ 圖1.3.3 彈出的打印瀏覽對話框選取“保存”便可以生成比較干凈整潔的PDF文檔了。


4、打印示例

1、開始打印輸出

下面是使用 新CSDN文章轉(zhuǎn)成PDF、打印(去空白) 的代碼執(zhí)行后打印輸出的PDF文件內(nèi)容。


▲ 圖1.4.1 打印輸出的PDF樣例可以看到在輸出的PDF頁面中，還存在一些我們不想要的內(nèi)容：


  • 文章收錄專欄內(nèi)容，在每一頁的最上部；
  • 專欄目錄狀態(tài)信息，在每一頁的最下邊；
  • 頁眉和頁腳；
頁面和頁腳信息可以通過打印預(yù)覽中設(shè)置去除之外，另外兩個(gè)內(nèi)容是原來代碼中沒有將CSDN顯示頁面中內(nèi)容清理干凈所造成的。


在粘貼的代碼中增加了一下刪除內(nèi)容，便可以將打印頁面中不需要的部分清除干凈了。


#blogColumnPayAdvert, #toolBarBox, #csdn-copyright-footer"

2、最新打印輸出

下面是最新的PDF生成頁面，可以看到已經(jīng)將文檔頁面做了最大的清理。


▲ 圖1.4.2 最新的打印輸出

02 如何整理頁面？

在CSDN顯示頁面中，存在著很多與博文無關(guān)的顯示欄、工具欄。在利用Chrome頁面打印之前需要講這些與博文無關(guān)的信息去除。


▲ 圖2.1 CSDN閱讀頁面

一、去除頁面無關(guān)元素

1、去除方法

可以看到在前面粘貼代碼的前半部分，存在大量 remove() 命令，用于去除頁面中不需要的元素。


$("#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, #blogColumnPayAdvert, #toolBarBox, #csdn-copyright-footer").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();
因此只需要將需要去除元素的 id 放入上面代碼中，便可以消除相關(guān)的現(xiàn)實(shí)元素。


2、如何定位元素ID ？

怎么能夠定位頁面元素的 id ？


（1）打開開發(fā)者工具

根據(jù)前面給出的方法，打開“開發(fā)者工具欄”。切換到對應(yīng)的“Element”頁面。


▲ 圖2.1.1 打開開發(fā)者工具，切換到Element頁面

（2）右鍵“檢查”命令

在頁面顯示元素上，右鍵菜單中的“檢查”命令，便可以同步在開發(fā)者工具欄中的“Element”顯示對應(yīng)的代碼段。


▲ 圖2.1.2 在顯示元素上面點(diǎn)擊右鍵，使用”檢查“命令在給出的代碼段上面可以找到對應(yīng)的該元素代碼段的id字符串：id=toolBarBox。


▲ 圖2.1.3 找到對應(yīng)的ID字符串將#toolBarBox加入到 前面粘貼代碼的 remove()函數(shù)中的參數(shù)里面，便可以去除對應(yīng)的頁面元素了。


二、修改頁面寬度

1、修改寬度比例

在前面粘貼代碼中，修改“width”對應(yīng)的寬度比例，可以調(diào)整內(nèi)容在A4頁面中的顯示寬度。下面代碼是將顯示寬度比例修改為90%，內(nèi)容顯示比例合適。


(".main_father.clearfix.d-flex.justify-content-center").css("width","90%");
如果上面的width的比例修改為 100% ，那么頁面就會(huì)出現(xiàn)右邊內(nèi)容超出有邊界的內(nèi)容。


2、修改頁面高度

通過打印預(yù)覽對話框設(shè)置打印頁面邊距。主要修改頁面的頭部和尾部的高度，可以調(diào)整每一頁打印內(nèi)容的高度。


▲ 圖2.2.1 設(shè)置打印頁邊距

※ 內(nèi)容總結(jié) ※

根據(jù)生成文檔的需要，在CSDN上尋找一些介紹將MARKDOWN文檔生成PDF博文。根據(jù)他們介紹的方法，測試打印的效果。特別是對于CSDN新增加的一些顯示元素的清理，可以生成更加干凈完整的PDF文檔。


比賽規(guī)則的正式文檔，請大家在競賽網(wǎng)站下載：


smartcar.cdstm.cn


◎ CDPDF程序

#下面是自動(dòng)將打印腳本粘貼在Chrome的開發(fā)者工具中console命令區(qū)，并執(zhí)行的程序。它在使用CTRL SHIFT I之后運(yùn)行。


#!/usr/local/bin/python
# -*- coding: gbk -*-
#******************************
# CDPDF.PY                     -- by Dr. ZhuoQing 2021-11-12
#
#   Usage:
#       Before using cdpdf, in Chrome, by CTRL SHIFT I to open
#       the developer tools windows of Chrome. Click "console"
#       to paste the following code into console. Press 'return'
#       to execute print dialog.
#
# Note:
#******************************
from head import *
codestr = '''(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, #blogColumnPayAdvert, #toolBarBox, #csdn-copyright-footer").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();
$("main").css('display','content');
$("main").css('float','left');
$("#mainBox").css('width','90%');
$(".main_father.clearfix.d-flex.justify-content-center").css("width","90%"); //顯示不全關(guān)鍵在于修改這里的width的比例
window.print();                  // 修改成 90% 基本就可以顯示全
})();'''
clipboard.copy(codestr)
printf('\a')
windtitle = tspgetwindowtitle()
printf(windtitle)
for s in windtitle:
if s.find('CSDN博客 - Google Chrome') < 0: continue
tspsendwindowkey(s, "v", control=1, noreturn=1)
tspsendwindowkey(s, "\r")
break
#------------------------------------------------------------
#        END OF FILE : CDPDF.PY
#******************************


本站聲明： 本文章由作者或相關(guān)機(jī)構(gòu)授權(quán)發(fā)布，目的在于傳遞更多信息，并不代表本站贊同其觀點(diǎn)，本站亦不保證或承諾內(nèi)容真實(shí)性等。需要轉(zhuǎn)載請聯(lián)系該專欄作者，如若文章內(nèi)容侵犯您的權(quán)益，請及時(shí)聯(lián)系本站刪除。
關(guān)閉
關(guān)閉