如何用纯JS导入字体? [复制]

2023-12-20

我需要在不使用的情况下完成一个网站CSS at all.

一切都很顺利,但我不知道如何改变我的字体系列与纯JS.

有谁知道如何使用导入字体JS only?

Thanks!


你说“纯JS”,但很可能你问的是如何在浏览器环境中做到这一点,这暴露了一个文档对象模型或 DOM https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model/Introduction。因此,您可以将它与 Javascript 一起使用。

除非这是一个棘手的家庭作业问题,否则没有理由避免使用 CSS,因为 CSS 始终可用,而且它是设计样式的正确工具。

改变font-family元素的定义很简单:

element.style.fontFamily = "Arial, Sans Serif";

现在,要导入字体,只需添加样式表或<style>DOM 元素,它有一个font-face rule:

var link = document.createElement('link');
link.setAttribute('rel', 'stylesheet');
link.setAttribute('type', 'text/css');
link.setAttribute('href', 'https://fonts.googleapis.com/css?family=Open+Sans:400italic,400,300,700');
document.head.appendChild(link);

目前没有其他方法可以做到这一点。 https://stackoverflow.com/questions/5586845/how-to-import-font-file-using-javascript

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何用纯JS导入字体? [复制] 的相关文章

  • Angular - 如何从 DOM 中删除我使用过 $compile 的元素?

    我需要的是两个 ng views 的功能 因为我不能 我想更改某些内容的innerHTML 并编译它 我遇到的问题是 当我再次更改内容时 我可以编译 但是 Angular 是否会自行删除绑定 或者我必须手动执行此操作 如果是这样 怎么办 编
  • 我如何能够以两行显示标题,并且每行的字体大小不同?

    我正在使用 Google Chart API 创建时间线图 并希望将图的标题修改为两行 问题 我如何能够显示具有不同字体大小的两线图表标题 电流输出 理想输出 相关研究 我唯一能找到的是有人试图用饼图来做到这一点 但我尝试了但无法使其发挥作
  • 使用 jquery 远程图像属性

    目前我正在尝试获取远程图像宽度 高度 我正在开发一个链接共享模块 就像当你在 Facebook 上粘贴链接时 你可以看到标题 描述和图像 所以我尝试使用 php getimagesize 来获取图像宽度 高度 但速度非常慢 所以我正在考虑使
  • 如何使用 JavaScript 创建链接?

    我有一个标题字符串和一个链接字符串 我不知道如何将两者放在一起以使用 JavaScript 在页面上创建链接 任何帮助表示赞赏 我试图解决这个问题的原因是因为我有一个 RSS 源并且有一个标题和 URL 列表 我想将标题链接到 URL 以使
  • JavaScript 中的埃拉托斯特尼筛法对大量数据无限运行

    我一直在尝试写埃拉托斯特尼筛法 http en wikipedia org wiki Sieve of EratosthenesJavaScript 中的算法 基本上我只是按照以下步骤操作 创建从 2 到 n 1 的连续整数列表 令第一个素
  • 如何修改每个JSON对象javascript

    我想修改里面的每个 JSON 值cooldown object cooldown user 1 This user2 0 This 在 Javascript 中使用 for 语句 我研究了好几个小时 只找到了内部的 blocks Edit
  • 如何在react-bootstrap中禁用表单提交的

    在下面的代码片段中 我有许多文本类型的输入表单 如果用户点击 我似乎会得到相同的合成事件 就像他们按下提交按钮一样 我想忽略作为表单提交 只允许一个人按下 提交 按钮 我删除了一些表单组以减少示例 在所有情况下 按钮或 ENTER 键 e
  • Chrome 中的性能问题

    我目前正在从事一个相对较大的项目 使用 AngularJs 构建 应用程序的一部分是一个表单 您可以向其中添加任意数量的页面 不幸的是 添加了很多不必要的垃圾 即表示表单模型的对象可能会变得非常大 在某些时候 Chrome 基本上无法处理它
  • 摩卡 - Chai Karma“套件未定义”

    我对 jscript tdd 很陌生 遇到了问题 希望有人能告诉我我在做什么 在浏览器中运行测试 通过 HTML 文件 一切正常 通过节点和业力运行它们我得到以下异常 我想在 node js 主机的 karma 中使用 Mocha 和 Ch
  • 带有淘汰赛js的隐形recaptcha

    我正在完成隐形验证码 但我在实现它时遇到问题 谷歌开发人员页面中的代码显示它应该是这样的
  • 引导程序提前输入未填充承诺的响应

    我的引导程序预输入如下
  • 在打字稿中导入 json

    我是 typescript 的新手 在我的项目中 我们使用 typescript2 在我的要求之一中 我需要导入 json 文件 所以我创建了 d ts 文件如下 test d ts declare module json const va
  • 使用 CSS 或 Javascript 填充动画

    我只是想知道是否可以使用 CSS 或 javascript 创建填充动画 基本上我想创建一个填充动画 如下图所示 http i40 tinypic com eit6ia png http i40 tinypic com eit6ia png
  • 如何解决 Typescript 构建中的错误“找不到模块 'jquery'”

    我目前在 ts 文件的顶部有这个import require jquery 我这样做是因为我试图在我的打字稿文件中使用 jquery 但我似乎无法编译它 因为它返回标题中所述的错误 我正在使用 ASP NET CORE 脚本文件夹 tsco
  • 在 HTML5 画布中,如何用我选择的背景遮盖图像?

    我试图用画布来实现这一点 globalCompositeOperation 但没有运气 所以我在这里问 这里有类似的问题 但我没有在其中找到我的案例 我的画布区域中有图层 从下到上的绘制顺序 画布底座填充纯白色 fff 用fillRect
  • 页面上使用 HTML Editor Extender 进行回发会导致 IE11 中出现 JavaScript 错误

    我已将 HTML 编辑器扩展程序添加到我正在处理的页面中 现在每当我在页面上发回帖子时 都会收到以下 Javascript 错误 JavaScript 运行时错误 参数无效 之后什么也没有发生 这在 IE10 或更低版本以及我所知道的所有其
  • Vuejs 2:去抖动不适用于手表选项

    当我在 VueJs 中反跳此函数时 如果我提供毫秒数作为原语 它就可以正常工作 但是 如果我将其提供为对 prop 的引用 它会忽略它 这是道具的缩写版本 props debounce type Number default 500 这是不
  • 从数据库检查数据的异步解决方案各种循环子句

    我想要做的是异步检查数据库并从中获取结果 在我的应用程序中我试图实现Asynchronously将此步骤解决为 从数据库中检查手机号码JsonArray循环子句的种类 Create JsonArray从结果 打印创建的数组 我学到了足够多的
  • 使用 Vue 的多模式组件

    我在 Vue 中实现动态模式组件时遇到问题 A common approach I follow to display a set of data fetched from the db is I dump each of the rows
  • 在 CKEditor 中设置字体大小和字体系列

    我正在使用 ckeditor 我想问一下这个插件如何设置font family和font size 我尝试过使用 CKEDITOR config font defaultLabel Arial CKEDITOR config fontSiz

随机推荐

  • Django 的 classonly 方法有什么用? [复制]

    这个问题在这里已经有答案了 源代码如下 class classonlymethod classmethod def get self instance owner if instance is not None raise Attribut
  • 如何使用Java Swing实现可拖动选项卡?

    如何使用 Java Swing 实现可拖动选项卡 我想将选项卡拖放到不同位置以重新排列选项卡 而不是静态 JTabbedPane EDIT Java 教程 拖放和数据传输 http java sun com docs books tutor
  • AngularJS,ng-repeat 和 ng-include 不渲染

    你好 我开始学习 Angular 当我结合使用 ng repeat 和 ng include 时遇到了问题 无论我做什么 我都无法渲染模板 我有一个简单的控制器 用于创建工作区列表 每个工作区都有一个 TemplateUrl 属性 我知道该
  • Chrome 中比 translateZ(0) 更好的解决方案来解决子像素边框图像缩放问题

    我遇到了边界图像切片线显示在使用 Transform scale 放大的元素上的问题 如下所示 这似乎只发生在 Chrome 中 通过阅读其他帖子 这似乎是 Chrome 子像素渲染问题 我尝试过 backface visibility h
  • ColdFusion CFC CORS 和 AJAX 帖子

    我正在尝试将表单发布到远程服务器 目前的总体思路是 HTML 将在本地运行并通过 AJAX 发布到远程服务器 因此有一个表单 JS 和它要发布到的 CFC 下面是JS document ready function submit click
  • 如何在 Swagger 规范中接收动态响应

    我想通过我的 API 从我的数据库请求一个表 但是 我不知道该表将有多少列 也不知道它将包含什么 我如何在 Swagger 中指定这一点 这就是我想做的 paths reports id get summary Detailed resul
  • 来自 DataFrame 的 Dask 数组

    有没有一种方法可以轻松地将数值数据帧转换为数组 如同values使用 pandas DataFrame 我似乎找不到任何方法来使用提供的 API 来执行此操作 但我认为这是一个常见的操作 编辑 是的 现在这是微不足道的 您可以使用 valu
  • Morris.js 未捕获类型错误:无法读取未定义的属性“匹配”

    我对此失去了理智 无法弄清楚这个问题 我使用以下代码使用 morris js 渲染图表 但不断收到 未捕获的类型错误 无法读取未定义的属性 匹配 错误 javascript和php代码如下 我将php json输出到控制台并将其粘贴到此 g
  • Rails 3:JSON 字符串中出现转义字符 (\)

    任何人都知道为什么我的一些 json 元素是反斜杠 逃脱了 而其他人却没有 first John last Smith dogs name Rex breed Lab name Spot breed Dalmation name Fido
  • 如何根据需要安装和/或重新安装 msiexec

    我在网络驱动器上放置了一个内部 MSI 我想编写一个登录脚本 以便我们网络上的任何人都可以将 MSI 安装到他们的计算机上 或者在 MSI 更新时自动重新安装它 这经常发生 如果我使用msiexec exe i REINSTALL ALL如
  • Node.js 温斯顿记录器;将日志插入日志文件时如何从换行符开始?

    我正在制作一个 Node js 应用程序 并且使用 Winston 来实现大部分日志记录目的 但是我发现日志文件中的所有记录都在一行中 我想为每条日志记录更改行 有什么方法可以做到这一点吗 我的代码 var winston require
  • Insert 上没有写@CreatedDate 注释的字段,@LastModifiedDate 是

    我创建了以下实体并使用 h2 对其进行测试 Getter public class Topic Id private long id private final Title title CreatedDate private LocalDa
  • 如何在悬停或单击时放大图像? [关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 我正在尝试使用 HTML 和 CSS 制作一堆图像 如果我将鼠标悬停或单击其中任何一个 它将在同一页面中放大 这就是我能够做的 img
  • 低垂的图形编程成果?

    我目前正在使用 Java2D 开发一款基于图块的游戏 我正在考虑添加一些廉价的视觉效果 例如 实现一个简单的粒子系统 可能类似于this http www jhlabs com java particles html 用于爆炸和 或烟雾 对
  • 如何将 ItemAdd 事件应用到自定义文件夹? Outlook 2010 VBA [重复]

    这个问题在这里已经有答案了 我正在尝试使用 ItemAdd 事件方法来监视新项目何时添加到收件箱下的子文件夹中 我的目录结构是这样的 Inbox subfolder 我想在将新电子邮件添加到子文件夹时运行代码 原因是我使用将某些电子邮件重定
  • Jasmine 单元测试抽象类

    有没有办法为抽象组件创建茉莉花单元测试 doing const fixture TestBed createComponent MyAbstractComponent 说 不能将抽象构造函数类型分配给非抽象构造函数类型 我尝试了一些搜索 但
  • 如何更改相机 2 中表面视图的高度和宽度

    我正在使用相机 2 我想自定义表面视图的高度和宽度 我正在使用以下代码
  • 有没有一种安全的方法可以从 Rust 中的可变引用中临时检索拥有的值? [复制]

    这个问题在这里已经有答案了 我正在使用两个独立的函数 第一个获取结构的自有实例然后返回它 第二个函数采用可变引用 但需要使用第一个函数 This structure is not Clone struct MyStruct fn take
  • 这真的是获取单个属性对象值的最短方法吗?

    我有一个具有单一属性的对象 但我不知道其名称 使用纯javascript 以下真的是获取此属性值的最短方法吗 obj Object keys obj 0 看起来好像很多 还有更好的选择吗 再次不使用任何 JS 库 在您描述的场景中 有一个带
  • 如何用纯JS导入字体? [复制]

    这个问题在这里已经有答案了 我需要在不使用的情况下完成一个网站CSS at all 一切都很顺利 但我不知道如何改变我的字体系列与纯JS 有谁知道如何使用导入字体JS only Thanks 你说 纯JS 但很可能你问的是如何在浏览器环境中