您的位置:首页 > Web前端 > JavaScript

js中动态生成表格

2017-01-16 17:14 204 查看
  <script type="text/javascript">
function
demo() {
// 获取输入框内输入的行和列的数值
var
rowValue = parseInt(document.getElementById("row").value);
var
colValue = parseInt(document.getElementById("col").value);

// 创建一个表格对象
var
tableObj = document.createElement("table");
// 遍历创建行
for
(var row = 0; row < rowValue; row++) {
//创建行标签对象
var
trObj = document.createElement("tr");
// 把行标签对象添加到表格对象中
tableObj.appendChild(trObj);
// 循环创建列对象
for
(var col = 0; col < colValue; col++) {
// 创建td标签对象
var
tdObj = document.createElement("td");
// 给td标签对象添加内容
tdObj.innerHTML = row +
"-" + col;
//把创建td对象添加到行中
trObj.appendChild(tdObj);
}
}
// 把创建的表格对象添加到body中
document.body.appendChild(tableObj);
}
    </script>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  前端开发