编写一段代码,如何用JS来实现插入几行几列的表格的功能,希望好心人能帮帮忙呢
谢谢哦。。这个对我很重要。现在我还有一个问题:插入的表格,都是空白的,插入后我可以在表格内写东西。就像WORD里面的插入表格类似。希望再能指点一二呢~~...
谢谢哦。。这个对我很重要。现在我还有一个问题:
插入的表格,都是空白 的,插入后我可以在表格内写东西。就像WORD里面的插入表格类似。希望再能指点一二呢~~ 展开
插入的表格,都是空白 的,插入后我可以在表格内写东西。就像WORD里面的插入表格类似。希望再能指点一二呢~~ 展开
1个回答
展开全部
页面代码:
<body>
<h1 style="color: blue">
现在要插入几行几列的表格了,请点击按钮
<input type="button" value="插入表"
onclick="javascript:insertTable(5,6)" />
</h1>
<h1 style="color: #fcdb33">
您也可以删除创建的所有表格,请点击按钮
<input type="button" id="del" value="删除表格"
onclick="javascript:delTable()" />
</h1>
<div id="container"></div>
</body>
js代码:
/**
* 插入表格
* @param row 行数
* @param col 列数
* @return
*/
function insertTable(row,col) {
//页面要有个标签可以放即将创建的table,我用了div,你也可以用别的标签
var div = document.getElementById("container");
var table = document.createElement("table");
div.appendChild(table);
table.border = "1px";
table.style.width = "750px";
table.style.height = "250px";
table.style.color = "green";
//少了这个tbody元素,在IE下将无法正常显示table
var body = document.createElement("tbody");
table.appendChild(body);
for ( var n = 0; n < parseInt(row); n++) {
var tr = document.createElement("tr");
body.appendChild(tr);
tr.style.color = "red";
for ( var i = 0; i < parseInt(col); i++) {
var td = document.createElement("td");
tr.appendChild(td);
td.style.color = "orange";
var center = document.createElement("center");
td.appendChild(center);
center.innerHTML="行列";
}
}
}
/**
* 删除表格
*
* @return
*/
function delTable() {
var div = document.getElementById("container");
var tCount = div.childNodes.length;
if (tCount > 0) {
var t = document.getElementsByTagName("table")[0];
if (div == t.parentNode)
div.removeChild(t);
} else {
alert("已经没有表格了!!");
}
}
<body>
<h1 style="color: blue">
现在要插入几行几列的表格了,请点击按钮
<input type="button" value="插入表"
onclick="javascript:insertTable(5,6)" />
</h1>
<h1 style="color: #fcdb33">
您也可以删除创建的所有表格,请点击按钮
<input type="button" id="del" value="删除表格"
onclick="javascript:delTable()" />
</h1>
<div id="container"></div>
</body>
js代码:
/**
* 插入表格
* @param row 行数
* @param col 列数
* @return
*/
function insertTable(row,col) {
//页面要有个标签可以放即将创建的table,我用了div,你也可以用别的标签
var div = document.getElementById("container");
var table = document.createElement("table");
div.appendChild(table);
table.border = "1px";
table.style.width = "750px";
table.style.height = "250px";
table.style.color = "green";
//少了这个tbody元素,在IE下将无法正常显示table
var body = document.createElement("tbody");
table.appendChild(body);
for ( var n = 0; n < parseInt(row); n++) {
var tr = document.createElement("tr");
body.appendChild(tr);
tr.style.color = "red";
for ( var i = 0; i < parseInt(col); i++) {
var td = document.createElement("td");
tr.appendChild(td);
td.style.color = "orange";
var center = document.createElement("center");
td.appendChild(center);
center.innerHTML="行列";
}
}
}
/**
* 删除表格
*
* @return
*/
function delTable() {
var div = document.getElementById("container");
var tCount = div.childNodes.length;
if (tCount > 0) {
var t = document.getElementsByTagName("table")[0];
if (div == t.parentNode)
div.removeChild(t);
} else {
alert("已经没有表格了!!");
}
}
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询