方正VDL+LOGO黑+简+Bold

字体ID

FZVDLLogoHJW-B

JS调用

第一步：引用JS文件

将以下代码添加到您网页的<head>标签之中

<script type="text/javascript" src="http://cdn1.foundertype.com/webfont/js/ftfont-init.js"></script>

第二步：将以下代码添加到您网页的<script>标签中

var fontCfg = { p:'your key', fonts: [ { fontName: 'FZVDLLogoHJW-B' , selecters: ['your selecters'] } ] }; var myFont = new FTFont(fontCfg);

其中：

fontName：即为字体ID值，如想查找某个字体ID值，可返回云字库字体页面，点击”获取字体ID“即可获取；

your key：即您使用方正云字库申请的key值，如已申请可直接使用，如未申请，可点击 立即申请；

your selecters：即为您所要显示效果的文本的父级标签，其中your selecters可为标签的ID值，也可为className 或 tagName;

your selecters 示例如下：

<p id="myText" class="myParagraph">我需要显示效果的文本</> your selecters即可以为 #myText 或 p 或 . myParagraph，您可自己视情况而定

同一页面，如何应用多款字体呢？

var fontCfg = { p:'your key', fonts: [ { fontName: 'FZVDLLogoHJW-B' , selecters: ['your selecters'] }, { fontName: 'Second font ID' , selecters: ['your selecters'] }, { fontName: 'Third font ID' , selecters: ['your selecters'] } ] }; var myFont = new FTFont(fontCfg);

其中：

Second font ID'：即为您要应用的第二个字体的ID值； Third font ID：即为您要应用的第三个字体的ID值；如您页面引用多款字体，可能还有Fourth font ID, Fifth font ID等等；如想查找字体ID值，可返回云字库字体页面，点击”获取字体ID“即可获取；

字体应用Demo

1、应用一款字体demo 2、应用多款字体demo 3、监听单款字体加载状态demo 4、监听所有字体加载状态demo

想了解更多关于JS接入文档，那就移驾 js调用文档页面吧