#はじめに
初学者の私が、アクティブラーニング兼備忘録の為にJavaScriptのメソッドをまとめる記事です。
少しずつ追記していきます。

#目次

getElementById
- 基本構文
- innerHTMLで活用
- onClickで活用

#getElementById
getElementByIdメソッド
HTMLタグで指定した任意のIDにマッチするドキュメント要素を取得する。
これが一番よく使う気がします。

##基本構文

<html>
  <body>
    <p id='hey'>Hello world</p>
    <script>
      console.log(document.getElementById('hey'));
    </script>
  </body>
</html>

<p id='hey'>Hello world</p>

##innerHTMLで活用

<html>
  <body>
    <p id='hey'>こんにちは</p>
    <input type='button' value='Click' onclick='myfunc()'>

    <script>
      let myfunc = () => {
        const myp = document.getElementById('hey');
        myp.innerHTML = 'こんばんは';
      }
    </script>
  </body>
</html>

ボタンを押すと「こんにちは」から「こんばんは」になる

##onClickで活用

<html>
  <body>
    <p>push button</p>
    <input type='button' id='myid' value='Click'>

    <script>
      let mybutton = document.getElementById('myid');
      let myfunc = () => {
        mybutton.value = 'Hello world';
      }
      mybutton.onclick = myfunc;
    </script>
  </body>
</html>

ボタンを押すと、ボタンに書いてある「Click」が「Hello world」になる