使用 js 将字体系列替换为类名

【问题标题】：use js replace font family with class name使用 js 将字体系列替换为类名
【发布时间】：2016-05-23 11:31:32
【问题描述】：

我发现一些代码可以更改带有 ID 的字体系列。但我想在我的网站中使用它并用类替换字体系列。

<!DOCTYPE html>
<html>
<body>
<div class="myP">This is a paragraph.</div>
<script>
    document.getElementsByClassName("myP").style.fontFamily = "Impact,Charcoal,sans-serif";
</script>
</body>
</html>

【问题讨论】：

标签： javascript replace font-family

【解决方案1】：

document.getElementsByClassName() 函数返回 HTMLCollection 对象。
如果有多个段落，您需要遍历该对象或直接通过其位置访问所需元素：

...
document.getElementsByClassName("myP")[0].style.fontFamily = "Impact,Charcoal,sans-serif";

https://jsfiddle.net/e2xzs9o2/

【讨论】：

【解决方案2】：

您可以使用 className 并在 CSS 中定义您的字体样式属性

var elements= document.getElementsByClassName("myP")
for (var i = 0; i < elements.length; i++) {

elements[i].className +=" myFont";
}

.myFont{
  font-family:Impact,Charcoal,sans-serif;
}

<div>This is a paragraph.</div>
<div class="myP">This is a paragraph.</div>
<div class="myP">This is a paragraph.</div>

【讨论】：