記念すべき第1回は、DOMについて解説していきます！
結論から言いますと、DOMはこんなことしたいときに使います。
例：HTMLにclass="A"があり、Aクラスを変数aClassに格納したいとき
HTML
<div class="A">あ</div>
JavaScript
const aClass = document.querySelector('.A');
あんまりパッとしないので、言葉で書くと
HTMLをJavaScriptで操作したいときに必要だよ！って感じです。
使えるようにする準備！これを書こう！
JavaScriptでHTMLのIDやclassに対して処理をしたいとき、まずは下記のコードをJavaScript内に記述します。
JavaScript
document.addEventListener('DOMContentLoaded', function () { //ここに処理が入るよ！ }
これをとりあえず一番上に書いて、{ }の中に関数とか変数かいていけばOKって感じ。
JavaScriptはHTMLを操作することがかなり多いから、基本的にこの記述をするんじゃないかな～と思います。
間違ってたらごめんなさい。有識者（働いている人）いたら逆に教えてください！
準備が終わったらいろいろ操作してみよう！
DOMの定義を一番上に記述して{}で囲ったら、中にいろいろ書いていきましょう！
できる操作にはこんなものがあります。
例：HTMLのクラスA(class="A")を、クラスA 1(class="A 1")に書き換えたいとき
HTML
<div class="A"></div>
JavaScript
①まずはquerySelectorを使って、class="A"を変数classAに代入する。
変数のところはuncoでもtanakaでもなんでもOK！
const classA = document.querySelector('.A');
②次にclassListを使ってクラス名に「1」を追加する。
追加は英語でadd！
classA.classList.add("1");
これをconsole.log(classA);として出力してみると、
<div class="A 1"></div>
と表示されていることがわかります！
DOMはHTML使うなら必須っしょ！
JavaScriptとHTMLは切り離すことができない、織姫と彦星的な存在。
運命の赤い糸で結ばれているので、絶対に覚えましょう！
余談：進捗と愚痴
今回はDOMについて解説してみました！
私は今日やっとこさコールバックを理解しました。
表面的な理解はしてましたが非同期処理を組み合わせるとこんがらがって理解できなかったのが、理解できるようになりましたね！
それも2時間かかりましたよ！頭悪すぎて牢屋にぶちこまれそう！
てことでちょっとした愚痴でしタ。
さて、勉強は毎日3時間ほどやっていますが仕事との兼ね合いもありなかなか更新できないかも？
みなさんも一緒に頑張りましょう！
Twitter(X):
はぁ...イーロンめ。Xの次はDOGE下げかよ！
ではまた！
