代码之家 › 专栏 › 技术社区 › Cymro

jQuery将字体A更改为字体B

font-awesome fonts jquery

Cymro · 技术社区 · 7 年前

我使用安全的网页字体快速加载页面。然后,我想在页面加载后将这个安全的web字体切换为designer字体。

大致如下:

if(font-family='FontA') -> this.css("font-family",'FontB');

如果您能在jquery中提供这样做的建议,我将不胜感激。 “为每个”循环?

1 回复 | 直到 7 年前

Eric Vautier 7 年前

您最好定义和使用样式:

.caseA {
  font-family: FontA;
}
.caseB {
  font-family: FontB;
}

然后在js中的两个选项之间切换:

if ($object->hasClass('caseA')) {
  $object->removeClass('caseA');
  $object->addClass('caseB');
} else {
  $object->removeClass('caseB');
  $object->addClass('caseA');
}

但您可以使用级联样式和单个覆盖:

.default {
  font-family: FontA;
}
.highlighted {
  font-family: FontB;
}

这样js更清晰,更易于维护:

if ($object->state === 'complete') {
  $object->removeClass('highlighted');
} else {
  $object->addClass('highlighted');
}

推荐文章

Simon · 使用React更改字体可怕图标的颜色

4 年前

Muhammad Asif Mohtesham · 在Font Awesome中,是否可以使用CSS内容属性在“far”和“fas”数据前缀之间切换?[副本]

8 年前

en Peris · 使用JQuery动态更改AwesomeIcon的颜色

8 年前

Pranta Saha · 为什么Font Awesome图标类不同

8 年前

Mav · 如何将图标与固定高度标记的中心对齐[重复]

8 年前

LP13 · 在中心对齐定位标记内的内容

8 年前

Fjott · CSS-居中字体超级图标

8 年前

Sinan Samet · 字体很棒的图标不会显示在Angular 5中

8 年前

Tithos · 品牌FA5图标不工作

8 年前

SuperUberDuper · 字体awesome在加载之前显示方块

8 年前