appendChild()に関しまして

Question

<script>
    'use strict'

    const div = document.createElement('div');
    div.classList.add('box');

    div.addEventListener('click', () => {
      div.classList.toggle('circle');
    });

    document.body.appendChild(div);
 </script>

定数を設定しているconst div = document.createElement('div');のdivがシングルクォーテーションで囲まれているのに対して、

document.body.appendChild(div);のdivがシングルクォーテーションが無いのはなぜでしょうか？

シングルクォーテーションが文字列を囲む為のものだという認識はしているのですが、この場合前者は「要素を作る」動作、後者は「親要素に子要素を入れる」動作いう認識ですので役割の違いが分かりません。

教えていただけますと助かります。

Answer 1

'div'が 文字列 であるのに対して， div はdiv要素を格納している 変数 となります．
document.createElement(...) では作成したい要素の名前を ... に文字列で指定することになっています．
そして document.createElement() で作成したdiv要素をdivという名前の変数に代入しています．

と学習コンテンツのQ&Aに記述されていました。

お騒がせしました。