Question

有没有一种使用javascript的方法来在网页中显示用于标记的字体系列？例如，我想展示用于h1标签的字体系列。

我知道我可以进入CSS并简单地将字体系列放在网页上，但是我希望在有人更改字体系列的情况下采用一种更具编程性的方法。

我也知道我可以使用浏览器开发人员的工具进行查看，但是我试图将其简单地显示在页面上。

Answer 1

是的，您只需计算元素的样式。干杯

const tag = document.getElementsByTagName('h1')[0],
      out = document.getElementById('result');

out.innerHTML = getComputedStyle(tag)['font-family'];

h1 {
  font-family: Tahoma, Arial, 'Times New Roman';
}

div {
  color: green;
  text-transform: uppercase;
  font-size: 1rem;
  font-weight: 600;
  text-decoration: underline;
}

div:after {
  content: 'One of these is your font, or potentially none of them, but these are the defaults provided in the css....to be clear.';
  text-transform: none;
  display: block;
  margin-left: .5rem;
  color: black;
}

<h1>HEY HEY HEY</h1>

<br/>

<div id="result"></div>

显示字体家族用于HMTL标签

1 个答案: