LoginSignup
1
0

More than 3 years have passed since last update.

JavaScriptの基本 1

Posted at

はじめに

この記事は、2019/11/1からプログラミング学習を始めた学生がプロのプログラマーになるまでのアウトプットする為の書き込みの場である。

JavaScript

DOMとはDocument Object Model(ドキュメントオブジェクトモデル)

  1. DOMツリーからノードを取得する
  2. JavaScriptでやりたい処理を書く
  3. イベント発火でHTML側で動かす

JavaScript書き方

  • document.getElementById("id名");
    • マッチするidを持つノードを取得することができます。
  •  document.getElementsByClassName("class名");
    • クラス名とマッチするデータを取得することができます。
  • document.querySelector("セレクタ名");
    • HTML上から、引数で指定したセレクタに合致するもののうち一番最初に見つかった要素1つを取得します。
    • DOMの取得とは、querySelectorメソッドなどを使用して、HTML要素をノードとして取得することです。
  •  addEventListener
    • あるノードオブジェクトに対して、イベントリスナを追加するメソッドです。
  • innerHTML
    • HTML要素の中身を書き換えることができます。
  • classList.add

    • クラスが追加されるようにclassList.addを利用します。
  • classList.remove
    • 
クラスを削除するclassList.removeを利用します。
  • Array.prototype.slice.call()
    • 引数にとったオブジェクトを配列に変換してくれます。
  • forEach()
    • 配列に対してよく使われる繰り返し処理です。
  • indexOf()
    • 配列に対してだけ使い、DOMを引数にとって一致した要素番号を戻します。

今日の感想 明日から

今日は、インプットに集中した結果、JavaScriptの基礎、jQueryの基礎を学んだ。
アウトプットについては、基礎的な事ができるまでこのまま毎日投稿するが、簡単で端的にアウトプットしていこうと思います。

終わりに

もっとこうした方が良いよなどご指摘頂けると幸いです

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0