javascript无法读取或修改浏览器全局字体设置，只能通过css属性控制网页元素字体样式，如用getcomputedstyle()获取、style属性或css类修改，并需注意兜底字体和性能优化。
JavaScript 无法直接读取或修改用户浏览器的全局字体设置（如系统默认字体、浏览器“设置→外观→自定义字体”里的配置），这些属于隐私敏感的底层偏好，现代浏览器出于安全与隐私考虑已禁止 JavaScript 访问。
能获取和修改的是网页自身的字体样式
你实际能操作的是当前页面中元素的字体相关 CSS 属性，比如 font-family、font-size、font-weight 等。这是前端控制视觉呈现的标准方式。
- 用
getComputedStyle()获取元素当前生效的字体值（只读） - 用
element.style.xxx或element.setAttribute('style', ...)修改内联样式 - 通过操作
<style></style>标签或 CSS 类来批量控制字体
获取某个元素的实际字体族
注意：返回的是最终计算值（可能被继承、被层叠覆盖），不一定是写在 HTML 或 CSS 中的原始值。
const el = document.querySelector('h1');
const computed = getComputedStyle(el);
console.log(computed.fontFamily); // 如 "Helvetica, Arial, sans-serif"
console.log(computed.fontSize); // 如 "24px"
console.log(computed.fontWeight); // 如 "700" 或 "bold"
动态修改字体设置的常用方法
推荐优先使用 CSS 类切换，而非硬编码 style，更易维护、支持响应式、利于性能。
-
切换预设字体主题：提前在 CSS 中定义好类，如
.font-serif、.font-mono，再用element.classList.toggle()切换 -
实时调整字号：绑定 range input，读取 value 后设置
document.body.style.fontSize = value + 'px'（注意单位） -
替换全局字体栈：修改
:root自定义属性，让 CSS 变量驱动字体，例如document.documentElement.style.setProperty('--base-font', '"Inter", sans-serif')
限制与注意事项
某些字体设置可能被用户样式表或浏览器强制策略覆盖（如强制使用等宽字体阅读模式），JavaScript 修改仅作用于页面渲染层，不影响系统级设置。
- 不能获取用户在浏览器设置里选的“最小字体大小”或“允许页面选择自己的字体”开关状态
- 修改
font-family时，应始终提供通用字体族兜底（如sans-serif），避免字体缺失导致排版异常 - 频繁修改样式可能触发重排重绘，大量元素需批量操作或用
requestAnimationFrame优化
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
