JavaScriptでタグを含む要素が返ってくる

質問

const base = document.getElementById('parent');
const children = base.children;

console.log(children[0]);
console.log(children[1]);
console.log(children[2]);

下に記述したHTMLの<ul>の子要素を取得するために上記のように記述しました。この場合添付画像のようなタグを含めた要素が返ってきます。タグの中に書かれた内容を取得するにはtextContentを使えば良いようです。

初心者なもので、
<タグを含めた要素を取得してどんな使い道があるのでしょうか？
意味がよくわかりません。　

使い慣れた方、これの使い道を教えてください。宜しくお願いいたします。

<ul id="parent">
<li id="first">1番目</li>
<li id="second">2番目</li>
<li id="third">3番目</li>
</ul>

回答No.1

AsarKingChang

> <タグを含めた要素を取得してどんな使い道があるのでしょうか？
例えば、入力枠が3個あったとします。
その中で、2番に入力してないときなどに、
class="error" （あくまで例）を継承させ、
例えば赤文字で「入力必須項目です」などと
表示をするタグそのもののアトリビュートをいじりたいことが
ほとんどです。逆に、中の要素を取り出すことは、
あまり多くはなく、実際は、INPUTパーツなどの入力物を
取り出すことが多いですよ。

なぜなら、最初から書いてある文字はJSで取りに行かなくても、
最初からわかってることなので、取り込む意味がないからです。
表示後変化しないものは、最初からJSに埋め込んでしまえばいいので
あまり活躍の場がないのですよ。