好的，我對這些東西很陌生。我以為我對 DOM 的理解是正確的，但我的代碼不起作用。任務是創建一個這樣的表
這是我做的一塊。您能幫我指出我犯的錯誤或代碼中缺少的部分嗎？非常感謝每一個幫助。
const tableValues = new Array(10).fill(false).map((x, i) => {
return new Array(10).fill(1).map((y, i2) => {
return (i 1) * i2
})
})
document.addEventListener('DOMContentLoaded', tableCreate, false);
function tableCreate() {
const table = document.getElementById("table");
tableValues.forEach((row) => {
const row = document.createElement("tr")
row.forEach(cell => {
const cell = document.createElement("td");
cell.innerHTML = cellText;
cell.appendChild(cellText)
}
row.appendChild(cell))
})
table.appendChild(body)
}<table>
<tbody id="table"></tbody>
</table>uj5u.com熱心網友回復：
我已經修復了您的腳本而沒有對代碼進行太多更改。研究它并找出問題所在
基本上你在兩個回圈之外都有 appendChild 。此外，您在單元格上使用了 appendChild 兩次 - 您可以在值上使用 createTextNode 以在單元格內容上使用 appendChild
const tableValues = new Array(10).fill(false).map((x, i) => {
return new Array(10).fill(1).map((y, i2) => {
return (i 1) * i2
})
})
document.addEventListener('DOMContentLoaded', tableCreate, false);
function tableCreate() {
const table = document.getElementById("table");
tableValues.forEach(values => {
const row = document.createElement("tr")
values.forEach(value => {
const cell = document.createElement("td");
cell.innerHTML = value;
//cell.appendChild(cellText)
row.appendChild(cell)
})
table.appendChild(row)
})
}<table>
<tbody id="table"></tbody>
</table>這是一個較短的版本
const tableValues = new Array(10).fill(false).map((x, i) => new Array(10).fill(1).map((y, i2) => (i 1) * i2))
const tableCreate = () => document.getElementById("table")
.innerHTML = tableValues
.map(values => `<tr>
${values
.map(value => `<td>${value}</td>`).join('')}
</tr>`).join('');
document.addEventListener('DOMContentLoaded', tableCreate);<table>
<tbody id="table"></tbody>
</table>轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/452199.html
標籤：javascript html 数组 dom