无法在div盒子中生成表格
用代码块功能插入代码，请勿粘贴截图
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>动态生成表格</title>
</head>
<style type="text/css">
h1,
#form1 {
width: 600px;
margin: 20px auto;
}
table {
border-collapse: collapse;
border-color: #0099FF;
width: 800px;
/* background-color: #fff; */
}
td {
/* border-color: #0099FF; */
padding: 5px;
border: 1px solid #0099FF;
}
</style>
</head>
<body>
<h1>软工2110班季馨妍的动态表格</h1>
<form id="form1" name="form1" method="post" action="">
<fieldset>
<legend>动态创建表格</legend>
<div align="center">行数：
<select name="lstRowNum" id="lstRowNum">
<option value="0">请选择</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select> 列数：
<select name="lstColNum" id="lstColNum">
<option value="0">请选择</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select>
<input name="btnCreateTable" type="button" id="btnCreateTable" onclick=createTable(); value="生成表格" />
</div>
</fieldset>
</form>
<div id="div1" align="center"></div>
<script>
var str = "";
function createTable() {
var col = document.getElementById("lstColNum").value;
var row = document.getElementById("lstRowNum").value;
document.write("");
for (var r = 0; r < row; r++) {
str += document.write("");
for (var c = 0; c < col; c++) {
str += document.write("| ");
str += document.write("第" + (r + 1) + "行第" + (c + 1) + "列")
str += document.write(" | ");
}
str += document.write("
")
}
str += document.write("
")
}
document.getElementById("div1").innerHTML = str;
</script>
</body>
</html>
运行结果没错
想在div盒子中生成表格
