通过JavaScript更改字体

因此，基本工作流程如下：

字体的异步文件上载（已完成）

获取URL（完成）

将字体更改为新的URL

---

我意识到这需要通过字体脸来完成，但我似乎不知道如何通过JavaScript访问它。

您可以使用

@font-face

规则创建一个新的

元素，并将其附加到

文档的
标题中：

var newStyle = document.createElement('style');
newStyle.appendChild(document.createTextNode("\
@font-face {\
    font-family: " + yourFontName + ";\
    src: url('" + yourFontURL + "') format('yourFontFormat');\
}\
"));

document.head.appendChild(newStyle);

当然，您可能还需要提供所有必要的字体格式和URL，除非您只担心对现代桌面浏览器的支持（在这种情况下，您只需要使用WOFF–我认为这是合理的，因为您提到了其他功能）。
定义一个FontFace对象：

new_font = new FontFace('conthrax', 'url(fonts/conthrax-sb.ttf)')

new_font.load().then(function(loaded_face) {
    // use font here

}).catch(function(error) {

});

new_font.load().then(function(loaded_face) {
    // use font here
    document.fonts.add(loaded_face)
}).catch(function(error) {

});

调用其加载方法下载字体：

new_font = new FontFace('conthrax', 'url(fonts/conthrax-sb.ttf)')

new_font.load().then(function(loaded_face) {
    // use font here

}).catch(function(error) {

});

new_font.load().then(function(loaded_face) {
    // use font here
    document.fonts.add(loaded_face)
}).catch(function(error) {

});

。。。这将返回一个承诺，该承诺在解析时通过加载的FontFace

将加载的字体添加到文档中：

new_font = new FontFace('conthrax', 'url(fonts/conthrax-sb.ttf)')

new_font.load().then(function(loaded_face) {
    // use font here

}).catch(function(error) {

});

new_font.load().then(function(loaded_face) {
    // use font here
    document.fonts.add(loaded_face)
}).catch(function(error) {

});

试着这样做：

let font = new FontFace("ExampleFont", 'url(ExampleFont.woff2) format("woff2")');
font.load().then(function(loadedFont)
{
    document.fonts.add(loadedFont);
    //do something after the font is loaded
}).catch(function(error) {
    // error occurred
});

现在，我明白了。我想他指的是带有face属性的html标记，他想用Javascript编写它+1.