| 項番 | ページ内リンク |
|---|---|
| 1 | 1-Domとは |
| 2 | 2-ノードとは |
| 3 | 3-タグとは |
| 4 | 4-要素と属性とは |
| 5 | 5-セレクタとは |
1-Domとは
ざっくりというと
- Document Object Modelの略
- 階層構造を持った文書表現のこと
詳しくは以下の記事を参考にしてください。
2-ノードとは
ざっくりというと
- 階層表現の単位
- いろいろな「〜ノード」呼ばれるものがある
詳しくは以下の記事を参考にしてください。
3-タグとは
ざっくりというと<>で囲まれたものこと
# タグについて
<p>Hello, World</p>
上記のようなhtmlの記述があった場合
- <p> : 開始タグ
- </p> : 終了タグ
- Hello, World : テキスト
となる
4-要素と属性とは
要素は、ざっくりというと
- Element
- 開始タグから終了タグまでを一つの単位として扱うものこと
# 要素について
<p>Hello, World</p>
上記のようなhtmlの記述があった場合、これ全てが1つの要素となる。
# 要素について
<h1><p>Hello, World</p></h1>
また、上記のようにタグをタグで囲まれている場合
- <h1><p>Hello, World</p></h1> : 親要素
- <p>Hello, World</p> : 子要素
となる。
属性は、ざっくりというと
- Attribute
- タグの中にあるもののこと
# 属性について
<a href="/hello"></a>
上記のようなhtmlの記述があった場合
- href="/hello" : 属性
- href : 属性名
- "/hello" : 属性値
となる
詳しくは以下の記事を参考にしてください。
5-セレクタとは
ざっくりというと
- htmlの要素を特定できるもの
- CSSやJavaScriptなどで特定のhtml要素を指定したいときに使うもの
# セレクタについて
<p id="hello"></p>
<p class="bye"></p>
<a href="/hello"></a>
上記のようなhtmlの記述があった場合
タグの種類 : 「p」 や「a」などのタグをセレクタとして利用できる
任意の名前 : idやclassなどに任意の名前を設定し、セレクタとして利用できる