THE HAM MEDIA BLOG

先日、いつものチャットメンバーで話をしているときに、DOM Sctiptingの話になったのですが、メンバーで「DOM」がよくわからない人がいたりしました。

でも、実際にDOMなんて用語で覚えようとしても、最初はピンとこなかったりしませんか？

JavaScriptとかjQueryにしろ、覚えておくべき用語なのですが、ピンとこないので、最初は感覚で使ってしまいましょう。

DOM？ドム？

DOMはDocument Object Modelのことで、HTML文書へのアクセスや操作の方法についてを定義したことなのですが、最初は用語で考えてもよくわからないですよね。

DOMって覚えるよりも、「HTML中のドコをどのようにしたいのか！？」なんてことで自分は覚えていたりします。厳密にいうと違う！とか言われるかもしれませんが、最初から厳密に覚えようとしても、覚えにくいので、最初はこれでいいと思っています。

HTML中のドコにあたるのが、タグだったり、属性だったり、テキストだったりするのですが、あとはそれらを使うための指定方法を知ればいいだけです。

jQueryの場合

jQueryでその「ドコ」にあたる指定をするのが、「$('')」であり、$('ドコ')という指定でその部分を扱うことができます。

例えばタグであれば$('div')とか$('p')なんて指定で、div全体とp全体に対して何をするのかという指定ができます。idであれば、#id名ですし、classなら、.class名を入れることで使えます。

CSSと同じです！CSSのドコの装飾をするの？と同じで、ドコに何をするのかを指定するのです。

DOMなんて言葉で覚えるより簡単ですよね。

このidとかタグの他にも、各属性なんかでも指定できたりしますが、それはjQueryであれば、jQueryセレクタ(Selectors - jQuery)の項目を覚えればＯＫ！参考にしながら該当箇所を指定できたらＯＫ！

使えそうかな？

DOMなんていうと良くわからなかったり、それを覚えないと先に進めないんじゃなんて思う人もいるみたいですが、何事も置き換えて考えてイメージして考えてみると、意外とすんなりできたりしませんか？

まずは使ってみたり、いろいろセレクタ使ってためしてみて、DOMのいろいろなところをしてみちゃいましょう！

複雑なのが最初は難しいので、CSSと同じようなところから初めてみて、そこから徐々にステップアップしてみてはいかがでしょう。