デイトラDay19 学習記録 DOM操作

2023年6月23日 19:36

DOMとは簡単に言うとHTMLとJavaScriptをつなげるための仕組みです。
これを理解すれば、JavaScriptで動きのあるサイトを作ることができます

１，DOMとは？

DOMとは、Document Object Modalの略です。
　
HTMLを書くとき、html>body>divという、階層形式で書きますよね

そして、htmlのデータはすべてdocumentというオブジェクトにすべてま　とめられています

よって、以下のコードを試しに実行すると、コンソールにhtmlの全てのデータが出力できます

console.log(document);

documentはhtmlのデータがまとめられたオブジェクトです
ということは．．．メソッドが使えます！

これから、いくつかのhtmlを操作するメソッドを紹介したいと思います

htmlの操作を行う前にまずは、操作したいhtmlを指定する必要があります。
htmlの指定の仕方は3つあります。

・idで指定

document.getElementById("id名");

・classで指定

document.getElementsByClassName("class名");

・タグで指定（例のコードはh1を取得）

document.getElementsByTagName("h1");

classとタグで指定するとき、Elementsと複数形になっているとおり、この二つは配列で複数のhtml要素を取得します。