在 Notepad++ 中格式化 HTML 的做法:將檔案或選取的片段導入瀏覽器端的標準化工具,該工具以 text/html 模式解析、序列化 body.innerHTML,並將規範化後的標記回傳至唯讀文字區,全程無需外掛、上傳或即時預覽。Notepad++ 非常適合撰寫與編輯 HTML——語法高亮、括號對應、多游標編輯與巨集都能直接使用,無需設定——但編輯器本身並未內建 HTML 格式化器,因此貼上來的片段(無論是擷取自網頁或手寫的標記)會維持原本雜亂的樣貌。最乾淨、又能避免安裝外掛的做法,是從 Notepad++ 複製片段,貼到瀏覽器端的 HTML 標準化工具,讓解析器修復並序列化後,再把結果複製回編輯器。這種做法依賴的是瀏覽器寬容的 text/html 權杖化器與樹狀建構器,而不是第三方的美化工具,這代表輸出反映的是瀏覽器實際渲染時會建構的結果,而非以正規表示式猜測的「應該是這樣」。請試試 HTML Cleaner,在瀏覽器中完成這項工作。

為何單靠 Notepad++ 無法格式化 HTML
Notepad++ 將 HTML 視為純文字。它能突顯標籤、對應括號、支援縮排輔助線,但不會像真正的格式化器那樣重寫你的標記。常見的變通方式都必須安裝額外元件:XML Tools 外掛(含 Pretty Print 指令)、Tidy2、JSTool,或綁定到「執行」選單的可攜式美化腳本。每個選項都會帶來系統管理員安裝、版本對應管理,以及每個專案的設定步驟。
對於使用受限制電腦、共享工作站,或臨時虛擬機器的讀者來說,外掛安裝不見得可行。也有人傾向完全避開編輯器擴充功能。在這些情況下,編輯器可以維持原狀,格式化工作交由瀏覽器處理,因為每個現代引擎都已內建完全相容的 HTML 解析器。瀏覽器端路線同時也迴避了每次外掛安裝後必然伴隨的維護問題:在下次 Notepad++ 升級後、在 Windows 政策更新後,或在可攜式版本搬移到新機器後,這個外掛是否仍然能運作。
瀏覽器解析器的做法
HTML Cleaner 工具接受任何 HTML 片段或完整文件,透過 DOMParser 以 text/html 模式執行,可選擇性地從解析後的內文中移除註解節點,再將結果從 body.innerHTML 序列化至唯讀文字區。不會上傳任何內容,解析後的標記也不會插入到當前頁面,解析期間片段內的腳本也不會被執行。根據 MDN 的 DOMParser 參考說明,產生的文件沒有瀏覽內容(browsing context),且已停用指令碼,但解析器在建構其獨立文件時,仍可能會擷取 iframe 與 img 網址所參考的資源。請避免貼上指向那些「流量本身就構成外洩」的主機的標記。
由於解析器遵循 WHATWG HTML Living Standard 的樹狀建構規則,輸出反映的是瀏覽器規範化序列化,而非正規表示式處理。這項差異很重要:天真的美化工具可能會拆開 pre、textarea、script 或 style 的原始文字內容,悄悄改變 DOM 的語意;而 DOMParser 依標準的原始文字規則逐字保留這些內容。輸出結果反映的是瀏覽器會建構的內容,而非美化工具對作者意圖的猜測。
如何透過瀏覽器在 Notepad++ 中格式化 HTML
- 在 Notepad++ 中,選取要清理的標記(或按 Ctrl+A 選取整個檔案),然後按 Ctrl+C 複製。
- 在新分頁中開啟 HTML Cleaner,將片段貼入輸入區。
- 決定是否要從解析後的內文中移除註解節點,然後據此啟用或停用該選項。
- 觸發標準化動作;工具會以 text/html 模式將輸入送入 DOMParser,並序列化 body.innerHTML。
- 在唯讀結果區檢視僅含內文的文字輸出,以及回報的註解移除數量。
- 複製完整結果,切回 Notepad++,取代原本的選取範圍,然後存檔。
- 確認即將承載標記的目的端在上線前是否需要依目的端特性設計的清理器(sanitizer),若有需要,請將清理後的輸出再導入該清理器。
瀏覽器標準化工具實際改變了什麼
瀏覽器的 text/html 解析器刻意設計得寬容。它會自動修復許多會讓嚴格 XML 解析器失敗的問題,再透過 body.innerHTML 序列化重建的樹狀結構。下表彙整了讀者將擷取的標記貼進 Notepad++ 後,在回傳文字中會看到的最常見轉換。
| 輸入樣式 | 解析器的處理 | 在輸出中可見的結果 |
|---|---|---|
| <DIV CLASS=X> | 將標籤名稱轉為小寫、為屬性值加上引號,並在缺少時補上預設值 | <div class="x"> |
| <table><tr><td>row</td></tr></table> | 依樹狀建構規則,在列群組外自動包入隱含的 tbody | 序列化文字中出現包好的 tbody |
| <p>one<p>two | 在下一個 p 開啟時關閉前一個 p,再於區塊結尾同時關閉兩個 | 輸出中為兩個完整的段落 |
| <!-- comment --> | 關閉註解移除時保留;開啟時則從解析後的內文中移除 | 序列化文字旁會回報移除數量 |
| <!doctype html><html><head><meta>...</head>... | Doctype、文件外殼與僅位於 head 的中繼資料都不屬於 body.innerHTML 範圍 | 不會出現在回傳文字中 |
| <script>...</script>、onerror=、javascript: 網址 | 逐字保留;解析器不會執行腳本,也不會移除危險的權杖 | 仍完整保留於輸出中 |
這就是誠實的契約。輸出就是解析器建構出來的內容,而不是作者輸入內容的美化或清理版本。
限制、界線與安全防線
此工具強制設定兩項明確的容量上限。原始輸入在超過 500,000 個 UTF-16 字碼單元時會於解析前被拒絕,而序列化後的內文在超過 1,000,000 個字碼單元時會於回傳前進行驗證。剛好等於上限的值會被接受;任一上限多一個單位就會以明確訊息失敗。不會切割、取樣、部分序列化,也不會悄悄切換成不同的清理政策。解析或註解移除後的空內文會回報為有效的零長度輸出,而非錯誤。
註解移除是唯一可選的刪除規則。此工具不刪除 script、style、iframe、表單、SVG、MathML、事件處理屬性、javascript: 網址、遠端網址、行內 CSS、data 屬性、ID、class 或未知元素。它不會重寫網址配置、不會強制內容政策,也不會套用白名單。它明確不是安全清理器。正如 MDN 的 innerHTML 參考所警告的,將解析後的標記複製到另一個執行環境,可能會在該處啟用被保留下來的行為。當不受信任的 HTML 將被注入到實際運作的頁面時,請使用維護良好、依目的端設計的清理器——針對即時 DOM 使用 DOMPurify、針對 CMS 使用白名單過濾器、針對安全顯示使用 Markdown 轉換器。
標準化也不是傳統意義上的美化工具。DOMParser 加上 innerHTML 會產生瀏覽器規範化序列化,但並不保證縮排、換行、屬性排序、原始空白保留,或在每個瀏覽器版本間都能位元對位元穩定輸出。若目的是壓縮後的套件,請將清理後的結果再導入壓縮器;若目的是在 Notepad++ 中維持穩定的縮排原始檔,請改在本機檔案上使用支援 XML 的美化工具。
何時該改用真正的清理器
只要標記會被注入實際運作的 DOM、渲染於 CMS 的所見即所得欄位、嵌入電子郵件模板,或交給任何會讓被保留的腳本與事件屬性生效的環境,就該使用依目的端設計的清理器。瀏覽器解析器能修復擷取的片段,但無法告訴你結果是否安全到可以發佈。對於大多數只是想清理 Notepad++ 原始檔中縮排漂移、缺少的 tbody 與零散註解的讀者,瀏覽器端標準化工具就是大小適中的工具。對於將電子郵件、擷取的網頁或第三方饋給中的 HTML 貼到任何之後會被渲染之處的讀者,清理步驟應位於標準化工具與目的端之間,而非取代目的端的清理。
如果工作流程在同一個編輯器中還會處理 XML 或 JSON,那麼另一個瀏覽器端的格式化器遵循相同的往返模式,且無需外掛。《在 Notepad++ 中無需外掛格式化 XML 資料》指南涵蓋了同樣的「複製—貼上—清理—貼回」模式,適用於格式正確的 XML,且關於容量上限、僅內文範圍與非清理器界線的原則以完全相同的方式適用。
如果你正在權衡選項,如何使用並排編輯器編輯 HTML對此有詳細說明。
如果你正在權衡選項,安全地將 HTML 轉換為 JavaScript 字串對此有詳細說明。