JavaScriptだけでページ内の文字サイズを変更する方法

JavaScriptだけでページ内の文字サイズを変更する方法についてです。

今回はJSで文字サイズを小、中、大の3段階に変えるコードを書いてみました。

文字の大きさは
小　→　75%
中　→　100%
大　→　150%
と完全に決め打ちです。

HTML部分
小、中、大のボタンを作ってそれぞれで呼び出すメソッドを定義します。

<button onclick="s()">小</button>
<button onclick="m()">中</button>
<button onclick="l()">大</button>

JavaScript部分

<script>

  //文字サイズを小さくする
  function s() { 
    document.body.style.fontSize = 75 + '%'; 
  }

  //文字サイズを普通にする
  function m() { 
    document.body.style.fontSize = 100 + '%'; 
  }

  //文字サイズを大きくする
  function l()  { 
    document.body.style.fontSize = 150 + '%'; 
  }
</script>

上記のように書くだけでJSだけで文字サイズの変更ができました。