js 动态创建了多个div并在新创建的div里再创建canvas标签

Question

动态创建了几个div，然后想在创建好的每个div里分别再创建一个canvas标签。

下面是我用for循环创建的多个div;

for (n = 0; n<8; n++) {

        var oDiv=document.createElement('div');

        document.body.append(oDiv);

    }

最后大概是这样的效果。

怎么样能使每个div都只有一个canvas？

<div><canvas></canvas></div>

<div><canvas></canvas></div>

<div><canvas></canvas></div>

<div><canvas></canvas></div>

<div><canvas></canvas></div>

Answer 1

for (n = 0; n<8; n++) {&nbsp; &nbsp; &nbsp; &nbsp; var oDiv=document.createElement('div'),&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; canvas = document.createElement('canvas');&nbsp; &nbsp; &nbsp; &nbsp; oDiv.appendChild(canvas);&nbsp; &nbsp; &nbsp; &nbsp; document.body.appendChild(oDiv);&nbsp; &nbsp; }

Answer 2

for (n = 0; n<8; n++) {&nbsp; &nbsp; &nbsp; &nbsp; var oDiv=document.createElement('div');&nbsp; &nbsp; &nbsp; &nbsp; document.body.append(oDiv);&nbsp; &nbsp; &nbsp; &nbsp; oDiv.html="<canvas></canvas>";&nbsp; &nbsp; }