我正在嘗試使用 javascript 中的循環在另外 5 個 div 中創建 5 個 div。我已經制作了主 div，但所有小 div 均僅在一個主 div 中創建，并且僅創建了三個小 div。如何為一個主div制作一個小div？同樣的事情必須重復5次。for(let n=0; n<5; n++){ var elm = document.createElement('div'); elm.id="comments"; document.getElementById('elm').appendChild(elm); var sec = document.createElement('div'); sec.id = "sec"; document.getElementById('comments').appendChild(sec);}#elm{ width: 90vw; height: 90vh; background: blue; }#comments{ background: brown; width: 100%; height: 150px; border: 2px solid yellow; }#sec{ width: 50px; height: 50px; background: chartreuse; z-index: 1000; border: 2px solid darkgreen; }<div id="elm"></div>
1 回答
富國滬深
TA貢獻1790條經驗 獲得超9個贊
該屬性id在文檔中必須是唯一的，class請改為使用。此外，您應該在每次迭代中將sec元素附加到當前創建的comments元素內：
for(let n=0; n<5; n++){
? var elm = document.createElement('div');
? elm.setAttribute('class',"comments");
? document.getElementById('elm').appendChild(elm);
? var sec = document.createElement('div');
? sec.setAttribute('class', "sec");
? elm.appendChild(sec); // append the sec element inside the current comments element
}
#elm{
? width: 90vw;
? height: 90vh;
? background: blue;
}
.comments{
? background: brown;
? width: 100%;
? height: 150px;
? border: 2px solid yellow;
}
.sec{
? width: 50px;
? height: 50px;
? background: chartreuse;
? z-index: 1000;
? border: 2px solid darkgreen;
}
<div id="elm"></div>
- 1 回答
- 0 關注
- 175 瀏覽
添加回答
舉報
0/150
提交
取消