JavaScriptで最初の子要素を取得する方法

方法1: firstChildプロパティを使用する方法

const parentElement = document.getElementById('parent');
const firstChildElement = parentElement.firstChild;

この方法では、getElementByIdメソッドを使用して親要素を取得し、firstChildプロパティを使用して最初の子要素を取得します。ただし、firstChildプロパティはテキストノードやコメントノードを含むため、要素ノードかどうかを確認する必要があります。

方法2: firstElementChildプロパティを使用する方法

const parentElement = document.getElementById('parent');
const firstChildElement = parentElement.firstElementChild;

この方法では、getElementByIdメソッドを使用して親要素を取得し、firstElementChildプロパティを使用して最初の要素ノードを取得します。このプロパティはテキストノードやコメントノードを含まないため、要素ノードを直接取得できます。

以上が、JavaScriptで最初の子要素を取得するための2つのシンプルな方法です。これらのコード例を使用すると、ブラウザ上で動作するWebページやアプリケーションで使用できます。