在JavaScript中构造由“createElement”创建的div

Question

在HTML中构建div是这样的：

<div id="parentdiv">
     <div id="childdiv"></div>
</div>

我的代码下面创建了2个div，但将子div放在父div旁边而不是在其中：

var pardiv = document.createElement('pardiv');
pardiv.setAttribute('id', "workspace");
pardiv.innerHTML = "Hello World";
pardiv.style.background = "red";
pardiv.width = 300;
pardiv.height = 300;
document.body.appendChild(pardiv);

var childdiv = document.createElement('childdiv');
    childdiv.setAttribute('id', "childdiv");
    childdiv.innerHTML = "Hello World";
    childdiv.style.background = "yellow";
    childdiv.width = 100;
    childdiv.height = 100;
    document.body.appendChild(childdiv);

如果程序员是通过JavaScript创建的，那么如何在HTML中构建div？

Answer 1

不要将childDiv附加到正文，而是将其附加到父元素，如下所示：

pardiv.appendChild(childdiv);

使用它，您应该能够设置与HTML中相同的结构。