整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
索微信公眾號了解更多： 每天看世界丫
1.link 標簽定義是什么？
a.link 標簽定義文檔與外部資源的關系。link 元素是空元素，它僅包含屬性。此元素只能存在于 head 部分，不過它可出現任 何次數。
b.link 標簽中的 rel 屬性定義了當前文檔與被鏈接文檔之間的關系。
c.常見的 stylesheet 指的是定義一個外部加載的樣式表。
2. link 和 @import 的區別是什么？
（1）從屬關系區別。@import 是 CSS 提供的語法規則，只有導入樣式表的作用；link 是 HTML 提供的標簽，不僅可以加載 CSS 文件，還可以定義 RSS、rel 連接屬性、引入網 站圖標等。
（2）加載順序區別。加載頁面時，link 標簽引入的 CSS 被同時加載；@import 引入 的 CSS 將在頁面加載完畢后被加載。
（3）兼容性區別。@import 是 CSS2.1 才有的語法，故只可在 IE5+ 才能識別；link 標 簽作為 HTML 元素，不存在兼容性問題。
（4）DOM 可控性區別。可以通過 JS 操作 DOM ，插入 link 標簽來改變樣式；由于 DOM 方法是基于文檔的，無法使用 @import 的方式插入樣式。
3.談談你對瀏覽器的理解？
瀏覽器的主要功能是將用戶選擇的 web 資源呈現出來，它需要從服務器請求資源，并 將其顯示在瀏覽器窗口中，資源的格式通常是 HTML，也包括 PDF、image 及其他格式。用 戶用 URI（Uniform Resource Identifier 統一資源標識符）來指定所請求資源的位置。HTML 和 CSS 規范中規定了瀏覽器解釋 html 文檔的方式，由 W3C 組織對這些規范 進行維護，W3C 是負責制定 web 標準的組織。但是瀏覽器廠商紛紛開發自己的擴展，對規范的遵循并不完善，這為 web 開發者帶來 了嚴重的兼容性問題。
簡單來說瀏覽器可以分為兩部分，shell 和 內核。其中 shell 的種類 相對比較多，內核則比較少。shell 是指瀏覽器的外殼：例如菜單，工具欄等。主要是提供 給用戶界面操作，參數設置等等。
它是調用內核來實現各種功能的。內核才是瀏覽器的核心。內核是基于標記語言顯示內容的程序或模塊。也有一些瀏覽器并不區分外殼和內核。從Mozilla 將 Gecko 獨立出來后，才有了外殼和內核的明確劃分。
4.談談你對瀏覽器內核的理解？
主要分成兩部分：渲染引擎和 JS 引擎。
渲染引擎的職責就是渲染，即在瀏覽器窗口中顯示所請求的內容。
默認情況下，渲染引 擎可以顯示 html、xml 文檔及圖片，它也可以借助插件（一種瀏覽器擴展）顯示其他類型 數據，例如使用 PDF 閱讀器插件，可以顯示 PDF 格式。
JS 引擎：解析和執行 javascript 來實現網頁的動態效果。最開始渲染引擎和 JS 引擎并 沒有區分的很明確，后來 JS 引擎越來越獨立，內核就傾向于只指渲染引擎。
5.常見的瀏覽器內核比較和區別是什么？
Trident：這種瀏覽器內核是 IE 瀏覽器用的內核，因為在早期 IE 占有大量的市場份額， 所以這種內核比較流行，以前有很多網頁也是根據這個內核的標準來編寫的，但是實際上這 個內核對真正的網頁標準支持不是很好。但是由于 IE 的高市場占有率，微軟也很長時間沒 有更新 Trident 內核，就導致了 Trident 內核和 W3C 標準脫節。還有就是 Trident 內核的 大量 Bug 等安全問題沒有得到解決，加上一些專家學者公開自己認為 IE 瀏覽器不安全的 觀點，使很多用戶開始轉向其他瀏覽器。Gecko：這是 Firefox 和 Flock 所采用的內核，這個內核的優點就是功能強大、豐富， 可以支持很多復雜網頁效果和瀏覽器擴展接口，但是代價是也顯而易見就是要消耗很多的資 源，比如內存。
Presto：Opera 曾經采用的就是 Presto 內核，Presto 內核被稱為公認的瀏覽網頁速度 最快的內核，這得益于它在開發時的天生優勢，在處理 JS 腳本等腳本語言時，會比其他的 內核快 3 倍左右，缺點就是為了達到很快的速度而丟掉了一部分網頁兼容性。
Webkit：Webkit 是 Safari 采用的內核，它的優點就是網頁瀏覽速度較快，雖然不及 Presto 但是也勝于 Gecko 和 Trident，缺點是對于網頁代碼的容錯性不高，也就是說對網頁 代碼的兼容性較低，會使一些編寫不標準的網頁無法正確顯示。WebKit 前身是 KDE 小組 的 KHTML 引擎，可以說 WebKit 是 KHTML 的一個開源的分支。
Blink：谷歌在 Chromium Blog 上發表博客，稱將與蘋果的開源瀏覽器核心 Webkit 分 道揚鑣，在 Chromium 項目中研發 Blink 渲染引擎（即瀏覽器核心），內置于 Chrome 瀏覽 器之中。其實 Blink 引擎就是 Webkit 的一個分支，就像 webkit 是 KHTML 的分支一樣。Blink 引擎現在是谷歌公司與 Opera Software 共同研發，上面提到過的，Opera 棄用了自己 的 Presto 內核，加入 Google 陣營，跟隨谷歌一起研發 Blink。
6.談談瀏覽器的區別是什么？
（1） IE 瀏覽器內核：Trident 內核，也是俗稱的 IE 內核；
（2）Chrome 瀏覽器內核：統稱為 Chromium 內核或 Chrome 內核，以前是 Webkit 內核，現在是 Blink 內核；
（3） Firefox 瀏覽器內核：Gecko 內核，俗稱 Firefox 內核；
（4） Safari 瀏覽器內核：Webkit 內核；
（5） Opera 瀏覽器內核：最初是自己的 Presto 內核，后來加入谷歌大軍，從 Webkit 又到了 Blink 內核；
（6） 360 瀏覽器、獵豹瀏覽器內核：IE + Chrome 雙內核；
（7） 搜狗、遨游、QQ 瀏覽器內核：Trident（兼容模式）+ Webkit（高速模式）；
（8） 百度瀏覽器、世界之窗內核：IE 內核；
（9） 2345 瀏覽器內核：好像以前是 IE 內核，現在也是 IE + Chrome 雙內核了；
（10）UC 瀏覽器內核：這個眾口不一，UC 說是他們自己研發的 U3 內核，但好像還 是基于 Webkit 和 Trident ，還有說是基于火狐內核。
7.瀏覽器的渲染原理是什么？
（1）首先解析收到的文檔，根據文檔定義構建一棵 DOM 樹，DOM 樹是由 DOM 元 素及屬性節點組成的。
（2）然后對 CSS 進行解析，生成 CSSOM 規則樹。
（3）根據 DOM 樹和 CSSOM 規則樹構建渲染樹。渲染樹的節點被稱為渲染對象， 渲染對象是一個包含有顏色和大小等屬性的矩形，渲染對象和 DOM 元素相對應，但這種 對應關系不是一對一的，不可見的 DOM 元素不會被插入渲染樹。還有一些 DOM 元素對應 幾個可見對象，它們一般是一些具有復雜結構的元素，無法用一個矩形來描述。 （4）當渲染對象被創建并添加到樹中，它們并沒有位置和大小，所以當瀏覽器生成渲 染樹以后，就會根據渲染樹來進行布局（也可以叫做回流）。這一階段瀏覽器要做的事情是 要弄清楚各個節點在頁面中的確切位置和大小。通常這一行為也被稱為“自動重排”。
（5）布局階段結束后是繪制階段，遍歷渲染樹并調用渲染對象的 paint 方法將它們 的內容顯示在屏幕上，繪制使用 UI 基礎組件。值得注意的是，這個過程是逐步完成的，為 了更好的用戶體驗，渲染引擎將會盡可能早的將內容呈現到屏幕上，并不會等到所有的 html 都解析完成之后再去構建和布局 render 樹。它是解析完一部分內容就顯示一部分內容，同 時，可能還在通過網絡下載其余內容。
8.渲染過程中遇到 JS 文件怎么處理？（瀏覽器解析過程）
JavaScript 的加載、解析與執行會阻塞文檔的解析，也就是說，在構建 DOM 時，HTML 解析器若遇到了 JavaScript，那么它會暫停文檔的解析，將控制權移交給 JavaScript 引擎， 等 JavaScript 引擎運行完畢，瀏覽器再從中斷的地方恢復繼續解析文檔。
也就是說，如果你想首屏渲染的越快，就越不應該在首屏就加載 JS 文件，這也是都 建議將 script 標簽放在 body 標簽底部的原因。當然在當下，并不是說 script 標簽必須放 在底部，因為你可以給 script 標簽添加 defer 或者 async 屬性。
9.async 和 defer 的作用是什么？有什么區別？
（1）腳本沒有 defer 或 async，瀏覽器會立即加載并執行指定的腳本，也就是說不等 待后續載入的文檔元素，讀到就加載并執行。
（2）defer 屬性表示延遲執行引入的 JavaScript，即這段 JavaScript 加載時 HTML 并 未停止解析，這兩個過程是并行的。當整個 document 解析完畢后再執行腳本文件，在 DOMContentLoaded 事件觸發之前 完成。多個腳本按順序執行。
（3）async 屬性表示異步執行引入的 JavaScript，與 defer 的區別在于，如果已經加 載好，就會開始執行，也就是說它的執行仍然會阻塞文檔的解析，只是它的加載過程不會阻 塞。多個腳本的執行順序無法保證。
10.什么是文檔的預解析？
Webkit 和 Firefox 都做了這個優化，當執行 JavaScript 腳本時，另一個線程解析剩下 的文檔，并加載后面需要通過網絡加載的資源。這種方式可以使資源并行加載從而使整體速 度更快。需要注意的是，預解析并不改變 DOM 樹，它將這個工作留給主解析過程，自己 只解析外部資源的引用，比如外部腳本、樣式表及圖片。
、nuget 引用
Select.HtmlToPdf
2、方法
using SelectPdf;using System.Collections.Specialized;using System.IO;using System.Web;namespace BQoolCommon.Helpers.File{public class WebToPdf{public WebToPdf(){//SelectPdf.GlobalProperties.LicenseKey="your-license-key";}/// <summary>/// 將 Html 轉成 PDF，並儲存成檔案/// </summary>/// <param name="html">html</param>/// <param name="fileName">絕對路徑</param>public void SaveToFileByHtml(string html, string fileName){var doc=SetPdfDocument(html);doc.Save(fileName);}/// <summary>/// 傳入 Url 轉成 PDF，並儲存成檔案/// </summary>/// <param name="url">url</param>/// <param name="fileName">絕對路徑</param>/// <param name="httpCookies">Cookies</param>public void SaveToFileByUrl(string url, string fileName, NameValueCollection httpCookies){var doc=SetPdfDocument(url, httpCookies);doc.Save(fileName);}/// <summary>/// 將 Html 轉成 PDF，並輸出成 byte[] 格式/// </summary>/// <param name="html">html</param>/// <returns></returns>public byte[] GetFileByteByHtml(string html){var doc=SetPdfDocument(html);return doc.Save();}/// <summary>/// 傳入 Url 轉成 PDF，並輸出成 byte[] 格式/// </summary>/// <param name="url">url</param>/// <param name="httpCookies">Cookies</param>/// <returns></returns>public byte[] GetFileByteByUrl(string url, NameValueCollection httpCookies){var doc=SetPdfDocument(url, httpCookies);return doc.Save();}/// <summary>/// 將 Html 轉成 PDF，並輸出成 Stream 格式/// </summary>/// <param name="html">html</param>/// <returns></returns>public Stream GetFileStreamByHtml(string html){var doc=SetPdfDocument(html);var pdfStream=new MemoryStream();doc.Save(pdfStream);pdfStream.Position=0;return pdfStream;}/// <summary>/// 傳入 Url 轉成 PDF，並輸出成 Stream 格式/// </summary>/// <param name="html">html</param>/// <returns></returns>public Stream GetFileStreamByUrl(string url, NameValueCollection httpCookies){var doc=SetPdfDocument(url, httpCookies);var pdfStream=new MemoryStream();doc.Save(pdfStream);pdfStream.Position=0;return pdfStream;}private PdfDocument SetPdfDocument(string html){var converter=new HtmlToPdf();converter.Options.WebPageWidth=1200;html=HttpUtility.HtmlDecode(html);return converter.ConvertHtmlString(html);}private PdfDocument SetPdfDocument(string url, NameValueCollection httpCookies){var converter=new HtmlToPdf();converter.Options.WebPageWidth=1200;if (httpCookies != && httpCookies.Count !=0){converter.Options.HttpCookies.Add(httpCookies);}return converter.ConvertUrl(url);}}}
近臨近開學了，大家都在忙著準備各種學習的資料，準備在新的學期好好學習，充實自己。小編身邊的同學也是如此，最近，小編的同學小麗就遇到了一個很棘手的問題。
她想將一個網頁的Python學習的教程打印下來，方便自己來學習，但是上千頁的教程，如果通過手動的方式，一個一個的去轉成pdf并保存到本地，實在是麻煩的不。
這就是一個html轉pdf的問題，其實網上有很多不錯的html資源，但是苦于學習起來，不方便！于是小編就跟小麗保證，這點小事包在我身上。今天，小編就跟分享一下如何用Python把html資料變成pdf。
如今網上的在線學習資料可謂是多如牛毛，為了方便講解，小編就利用python3.9.2的中文文檔作為演示的例子，來將其抓取并保存到本地，其網頁鏈接如下：
https://docs.python.org/zh-cn/3.9/tutorial/index.html
打開上述鏈接后，大家會在網頁中找到不同內容的鏈接地址，包括了基礎的python字符、python語法等內容。
在上圖中，我們需要格外關注的是紅色方格標注的鏈接，每個鏈接都會跳轉到對應的子網頁中，而在子網頁中，就是我們想要保存的內容。
可以看到，上圖中，在python速覽子頁面中，包含了我們需要提取的文字內容。所以將html內容保存為pdf的第一步便是獲取到子頁面的鏈接。由于教程大都是固定內容，因此對于教程的網頁，大都采用的是靜態頁面，在網頁源代碼中可以很輕松地找到子頁面的網頁鏈接。
對于子網頁的鏈接抓取，程序如下圖所示:
程序中，通過BeautifulSoup庫來解析網頁源代碼，然后提取所有的子頁面鏈接地址并返回，如果抓取失敗，則直接返回None。
03.html轉pdf
在得到子網頁的鏈接后，接下來就是將html的子網頁保存為pdf文件。小編使用的pdfkit庫，pdfkit庫可以將網頁保存為pdf文檔。首先小編來介紹一下pdfkit庫的安裝。
按照上述的操作流程，就可以安裝pdfkit庫。對于pdfkit庫的使用，常見的用法有以下三種：
上面的程序主要完成以下幾步：
首先需要指定wkhtmltopdf.exe文件的路徑；
因此，pdfkit庫只能將子網頁保存為單獨的pdf文檔，無法直接通過pdfkit庫將所有的子網頁拼接成一個完整的pdf文檔，小編通過PyPDF2庫中的PdfFileMerger類來實現pdf文檔的拼接。程序如下圖所示。
程序中首先將所有的html網頁保存為單獨的pdf文檔，然后通過PdfFileMerger類對象來實現pdf文檔的拼接。最后就可以得到全部的pdf內容。最后我們通過視頻的展示，來看一下程序的效果吧。
除此之外，程序不光可以抓取python3.9的中文文檔，針對其他的在線文檔，只需要對獲取網頁鏈接的程序進行修改即可抓取，例如對于Flask中文文檔的抓取，程序只需要按照下圖進行修改，即可將Flask的在線文檔保存為PDF文檔。
學習Python其實非常有趣，也很有用。因為Python有大量的現成的庫，可以幫助我們把工作中的很多瑣碎的煩事輕松解決。小編將上述的程序稍加修改，很快就幫阿麗搞定了教程，保存為pdf發送給了她，小編與女神的關系更拉近了一步
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
