emfont 官方文件

JavaScript 載入字體

使用 JavaScript 載入 emfont

emfont 可以使用函式庫來自動抓取頁面上的所有文字,並載入所需的字型。然而現在 emfont 支援純 CSS 載入字體,詳見純 CSS 載入字體。大多情況也建議你這麼做。

JavaScript 載入字體的好處是有許多強大的功能可以更彈性地控制載入時機和機制,並且可以在頁面載入後動態新增文字時使用。缺點是如果是動態網頁需要重新呼叫 emfont.init(),尤其是遇到 input 輸入框時,會比較麻煩。

選擇字型

<p class="emfont-jfOpenHuninn">
    這個段落使用了 justfont 的 open 粉圓字型。
</p>

載入並啟動 emfont

<script type="module">
    import "https://font.emtech.cc/emfont.js";
    emfont.init();
</script>

要放在 <head><body><footer> 都行。幾 KB 而已,你開心就好。但請記得先載入完 HTML 再執行這段 script,否則 emfont 找不到字。

如果你不喜歡使用 module,也可以使用傳統的 script 標籤載入 emfont.js。

<script src="https://font.emtech.cc/emfont.js"></script>
<script>
    emfont.init();
</script>

On this page