divを使う主な目的は3つです。
① 要素をグループ化するため
複数の要素を1つにまとめて扱いたいときに使います。
<div>
<h2>タイトル</h2>
<p>説明文です。</p>
</div>
この場合、h2とpをひとまとまりとして扱えます。
② CSSを当てやすくするため
まとまりごとに背景色、余白、幅などを指定できます。
<div class=”box”>
<p>文章</p>
</div>
③ JavaScriptで操作しやすくするため
特定のブロックを取得して表示・非表示・差し替えなどができます。
WHATWGは、divを「スタイリングやスクリプトの都合で使う要素」と位置づけています。