在form/div標籤中動態新增表格
動態建立表出現在 div 標籤外部。
我正在建立一個響應式註冊表單。輸入欄位取得使用者給定的表格所需的行數，並建立具有固定列數的所需行數。
我創建了表格，但它沒有出現在我想要的位置。請大家給點建議。也可以幫助解決第一行中的標籤問題，即標題（th）。
function createFamTable() {
var rows = document.getElementById("family-rows").value;
var tbl = document.createElement("table");
tbl.id = "family-table1";
var tblBody = document.createElement("tbody");
for (let i = 0; i < rows; i++) {
var row = document.createElement("tr");
for (let j = 0; j < 5; j++) {
var cell = document.createElement("td");
switch(j) {
case j=0:
var cellText = document.createElement('input');
cellText.placeholder = "Enter Name";
cell.appendChild(cellText);
break;
case j=1:
var cellText = document.createElement('input');
cellText.placeholder = "Enter Relation";
cell.appendChild(cellText);
break;
case j=2:
var cellText = document.createElement('input');
cellText.placeholder = "Enter Profession";
cell.appendChild(cellText);
break;
case j=3:
var cellText = document.createElement('input');
cellText.placeholder = "Enter Age";
cell.appendChild(cellText);
break;
case j=4:
var cellText = document.createElement('select');
var arr = ["Select Yes / No","Yes","No"];
for (var k=0;k<=2;k++){
var opt = document.createElement('option');
opt.value = arr[k];
opt.text = arr[k];
cellText.appendChild(opt);
}
cell.appendChild(cellText);
break;
}
row.appendChild(cell);
}
tblBody.appendChild(row);
}
tbl.appendChild(tblBody);
document.body.appendChild(tbl);
cell.setAttribute("border", "2");
addFirstRow();
}
<div class="form third">
<div class="details education">
<span class="title">Family Details</span>
<div class="fields">
<label>Number of Family Members<span style="color:red;font-size: smaller;">*</span></label>
<input type="number" id="family-rows" placeholder="Example: 5" required>
</div>
<button class="createFamilyTable" onclick="createFamTable()">Add Details</button>
<div class="buttons">
<div class="backBtn1">
<i class="uil uil-navigator"></i>
<span class="btnText">Back</span>
</div>
<button class="nextBtn2">
<span class="btnText">Next</span>
<i class="uil uil-navigator"></i>
</button>
</div>
</div>
</div>
</form>
我希望表格出現在 div 標籤中（在那個空白區域中）。
我還嘗試為表格新增標籤標題。請也幫忙解決這個問題。
