<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<style>
#content {
500px;
height: 500px;
border: 1px solid blue;
}
</style>
<script>
onload = function () {
var btnCrea = document.getElementById("btnCrea"); //button for create a table
var content = document.getElementById("content"); //get the content for inner text
btnCrea.onclick = function () {
//create a table
var table = document.createElement("table");
table.width = "400px";
table.height = "400px";
table.border = "1px";
table.style.padding = "0";
table.style.borderCollapse = "collapse";
var rows = document.getElementById("rows").value; //row
var cols = document.getElementById("cols").value; //cols
//Create rows
for (var i = 0; i < rows; i++) {
var tr = document.createElement("tr");
for (var j = 0; j < cols; j++) {
var td = document.createElement("td");
td.innerHTML = i + "" + j;
tr.appendChild(td);
}
table.appendChild(tr);
}
content.appendChild(table);
};
};
</script>
</head>
<body>
行：<input type="text" id="rows" />
列：<input type="text" id="cols" />
<input type="button" value="Create" id="btnCrea" /><br />
<br />
<div id="content"></div>
</body>
</html>