Javascript 在前端使用通过API接收的字体定义作为字符串

我通过API获得自定义字体，如下所示：

"@font-face {
  font - family: 'Custom Font Name';
  src: url('https://base_url/fonts/pGdyQlal_QW0WERKk_405638ad.eot');
  src: url('https://base_url/fonts/pGdyQlal_QW0WERKk_405638ad.eot?#iefix') format('embedded-opentype'),
  url('https://base_url/fonts/pGdyQlal_QW0WERKk_405638ad.ttf') format('opentype'),
  url('https://base_url/fonts/pGdyQlal_QW0WERKk_405638ad.woff') format('woff');
  font - weight: normal;
  font - style: normal;
}
"

我需要将此字体族定义放在php/html文件的样式标记中，或在现有CSS文件中写入/追加，以便可以使用自定义字体名作为字体族属性的值。 我必须填充选择下拉列表来选择API中收到的这些自定义字体。 我正在使用Javascript和jQuery编写脚本

---

请指导解决方法，因为收到的是字符串，而不是css。

您不必这样做。请查看webfont提供商的文档。你会发现一个脚本，当把它放在你的html中时，它会使字体自动可用于你的页面。

样式表注入

应该这样做。创建样式表并将其innerHTML设置为CSS字符串。享受吧

function injectCSS( str ) {
    const style = document.createElement( 'style' );
    style.innerHTML = str;
    document.body.appendChild( style );
}

injectCSS( cssStr );

const cssStr = `@font-face {
  font - family: 'Custom Font Name';
  src: url('https://base_url/fonts/pGdyQlal_QW0WERKk_405638ad.eot');
  src: url('https://base_url/fonts/pGdyQlal_QW0WERKk_405638ad.eot?#iefix') format('embedded-opentype'),
  url('https://base_url/fonts/pGdyQlal_QW0WERKk_405638ad.ttf') format('opentype'),
  url('https://base_url/fonts/pGdyQlal_QW0WERKk_405638ad.woff') format('woff');
  font - weight: normal;
  font - style: normal;
}`;

---

请展示一些您已经尝试过的代码，并描述它是如何不适合您的。