ノード

ノード

ノードとは、
枝分かれしているそれぞれの要素がノード(node)です。図にすると、

htmlなどがノードになります。ノードのデータを取得することができます。


<html lang='jp'>
<head>
<meta charset='UTF-8' />
<title>sample</title>
</head>
<body>
<div>DOMはツリー構造です。<br>
</div>
<script>
window.alert(document.firstChild.childNodes[2].childNodes[1].firstChild.nodeValue);
</script>
</body>
</html>

これをブラウザで表示します。最初にアラートが表示されます。

<div>要素の、
DOMはツリー構造です。
を取得してアラートで表示しています。


document.firstChild.childNodes[2].childNodes[1].firstChild.nodeValue

なんだかよくわからない記述ですね。Visual Studio Codeなら値を知ることができます。

firstChildにカーソルを置けば、その内容を表示してくれます。次のchildNodesにカーソルを置くと、以下のような表示になります。

childNodes[2]がbodyであることが分かります。

このようにVisual Studio Code を使うととても便利です。

しかし、
ノードを使って処理をするなんてことはどれだけあるんだーー！
書籍にも積極的な活用例はありません。
軽く知っておくだけのことだと思います。