程式碼演練場
線上 HTML、CSS 和 JavaScript 演練場，帶即時預覽、行號編輯器和主控台輸出。即改即測，結果可下載為單一 HTML 檔案——完全在瀏覽器中執行。
什麼是程式碼演練場？
程式碼演練場是一個沙箱環境，你可以撰寫 HTML、CSS 和 JavaScript 並立即看到渲染結果。本工具還提供主控台擷取、帶行號的編輯器，以及把作品下載為單一 HTML 檔案的功能。
即時預覽是怎麼運作的？
三個程式碼面板會被組合成一個完整的 HTML 文件，並在沙箱 iframe 中渲染。開啟自動執行後，停止輸入約半秒即自動重新整理預覽；也可以手動點擊「執行」。
主控台面板顯示什麼？
頁面透過 console.log、console.info、console.warn、console.error 輸出的所有內容，以及執行時錯誤和未處理的 Promise 拒絕（含行號）。每次執行都會清空。
重新整理頁面後程式碼會保存嗎？
會。三個面板的草稿保存在瀏覽器本機，下次造訪自動還原。點擊「重設」可回到預設範例程式碼，清除網站資料會刪除草稿。
預覽是沙箱化的嗎？安全嗎？
預覽在無同源權限的沙箱 iframe 中執行，測試的腳本無法讀取本頁面及其 Cookie。但仍只測試你信任的程式碼，因為腳本依然在你的瀏覽器中執行。
可以把實驗結果下載下來嗎？
可以。點擊「下載 .html」會把目前的 HTML、CSS 和 JavaScript 合併為一個獨立的 HTML 檔案，可在任意瀏覽器開啟或分享給他人。
JavaScript 面板能執行什麼？
標準瀏覽器 JavaScript：DOM 操作、事件、canvas、fetch 公共 API（受其 CORS 限制）、內嵌貼上的函式庫程式碼。不支援模組解析和 npm 套件。
演練場需要連線嗎？
僅在載入頁面本身時需要。之後的編輯、預覽和主控台擷取都在本機進行，你輸入的程式碼不會被上傳到任何地方。
如何使用程式碼演練場
這個演練場把你的 HTML、CSS 和 JavaScript 合併到瀏覽器內的沙箱即時預覽中，主控台面板可擷取日誌與錯誤。草稿會本地保存，隨時接續上次的進度。
- 分別編輯 HTML、CSS 和 JavaScript 面板——每個編輯器都有行號與語法高亮。
- 開啟自動執行後，輸入即自動重新整理預覽；也可以關閉自動執行，手動點擊「執行」。
- 留意預覽下方的主控台面板：console.log 輸出、警告、錯誤與未捕捉例外都會連同行號顯示在這裡。
- 點擊「重設」可回到內建示範程式碼，或點擊「下載 .html」把全部內容存成單一獨立檔案。
- 使用「新視窗開啟」可在獨立分頁中全尺寸檢視目前文件。
每次執行主控台都會清空，除錯時可以放心多加 console.log——輸出即時顯示，不必開啟瀏覽器主控台。
相關工具
- JavaScript美化器 免費線上JavaScript美化器和程式碼格式化器。立即將壓縮或混亂的JS轉換為整潔、可讀、縮排規範的程式碼，支援自訂選項。
- JS壓縮器 即時壓縮JavaScript程式碼。移除空白、註解，最佳化JS以減小檔案大小，加快載入速度。
- 正規表示式測試 即時測試和除錯正規表示式，支援分組捕獲和速查表。
- Markdown 預覽器 免費線上 Markdown 編輯器，支援即時預覽。編寫、渲染和匯出 Markdown，完整支援 GFM 表格、程式碼區塊和任務清單。
- 檔案雜湊校驗 本地計算校驗MD5、SHA-1、SHA-256、SHA-512檔案雜湊值
- Chmod 計算器 免費線上chmod計算器，透過核取方塊視覺化Linux檔案權限並計算chmod值。即時轉換數字(755, 644)和符號(rwxr-xr-x)表示法，支援setuid、setgid、sticky bit等特殊權限。
- ASCII碼表 完整的ASCII字元編碼參考表，包含十進位、十六進位、八進位、二進位編碼、HTML實體和字元描述。支援即時搜尋和篩選。
- Hex檔案檢視器 以十六進制轉儲格式檢視檔案內容，支援搜尋、偏移導航和虛擬滾動