如何用javascript修改根元素

Question

我有一个问题。 如何使用javascript更改font-size的{​​{1}}？ 我需要在整个网站上设置一个按钮来调整字体大小。

Answer 1

如果您更改document.body.style.fontSize，则基本上正在更改:root。只要您的其他款式使用em或rem字体大小，网站上的所有文字都应相应更改。

Answer 2

虽然我不知道--font-size应该是什么，但访问:root本身似乎正在使用CSSStyleSheet.insertRule()

function doThing(){
  document.styleSheets[0].insertRule(':root { font-size: 26px; }');
}

HelloWord<br>
<button onclick="doThing()">Clicky</button>