本文目录一览：
JS通过输入值做表格的代码
!DOCTYPE html
html
head
meta http-equiv="Content-Type" content="text/html; charset=UTF-8"
titleRunJS 演示代码/title
style
* {
margin: 0;
}
body {
background-color: rgb(44, 52, 55);
}
table {
border-collapse: collapse;
}
th,td {
border: 1px solid #fd3;
width: 20px;
height: 15px;
}
/style
script
var produce = function() {
var tab = document.createElement("table");
var tb = document.createElement("tbody");
var i = r.value * 1;
var j = c.value * 1;
for (var m = 0; m i; m++) {
var tr = tb.insertRow(tb.rows.length);
for (var n = 0; n j; n++) {
tr.insertCell(tr.cells.length);
}
}
result.innerHTML = "";
tab.appendChild(tb);
result.appendChild(tab);
}
/script
/head
body行数：
input type="text" id="r" /
br /列数：
input type="text" id="c" /
br /
button onclick="produce()"生成表格/button
div id="result"/div
/body
/html
求一段表格效果的JS代码
用jQuery实现，代码如下：
var defaultColor="#112233";
$(function(){
$("table tr").each(i){
if(i5)
{
$(this).css("background-color","#112233");//前五行颜色
}
else
{
$(this).css("background-color","#223344");//五行之后的颜色
}
$("table tr").hover(function(){
defaultColor=$(this).css("background-color");
$(this).css("background-color","#334455");//鼠标移到的颜色
},function(){
$(this).css("background-color",defaultColor);//鼠标移出的颜色，恢复默认颜色
});
}
});
html中如何使用js动态添加表格
一、动态加载表格
1.首先在html中为表格的添加位置设置id
即是在html的body标签内部写一个div标签表明表格要添加到此div的内部。如下
div id="tdl"div
2.在javascript中写添加表格的语句
若在当前html文件中，则写在script标签内部，如
复制代码 代码如下:
script type="text/javascript"
document.getElementById("tbl").innerHTML="tabletrtd/td/tr/table" //此处添加的表格可根据自己需要创建
/script
若是通过引入js文件，则在js文件（假设是test.js）中直接写如下语句
复制代码 代码如下:
document.getElementById("tbl").innerHTML="tabletrtd/td/tr/table"
然后再引入自己的html文件
复制代码 代码如下:
script type="text/javascript" src="test.js"/script
二、 动态添加表格行
1.首先在html中为表格行的添加位置设置id，此位置必须是tbody内部（不是特别准确，但根据我的测试就得到此结论，有其他的方法请留言，谢谢），如下
复制代码 代码如下:
table
thead/thead
tfoottfoot //tfoot与thead是与tbody配套使用，但我在写的时候，没用也可以。
tbody id="rows"/tbody
/table
[\s\S ]*\n
2.在javascript内容中，要先创建行和单元格，再在.tbody中添加行，如下
[code]
row=document.createElement("tr"); //创建行
td1=document.createElement("tr"); //创建单元格
td1.appendChild(document.createTextNode("content")); //为单元格添加内容
row.appendChild(td1); //将单元格添加到行内
document.getElementById("rows").append(row); //将行添加到tbody中
怎么用js做一个表格
1．在页面div中创建一个空白表，可以根据需要对其进行定制。
2．创建表之后，我们可以编写关键代码来动态生成表。我们编写了一个js方法来触发使用。
3.在 TB 标签中，我们添加了标签，主要用于提供用户输入参数，而全局变量num主要用于区分每个添加参数的唯一id。
4．获取表中的数据，以供下图参考。
5．一旦我们获得了表中的数据，我们就应该将其转换成json数据的形式。
js代码操作表格，实现动态计算
数据导入后，表格上有一个序号列，这个是唯一的
可以用
序号+列名当作 数量，单价、小计这三个td的ID值，
双击的时候改变值，数量与单位onblur时进行计算，
再把结果放到小计里边
用js怎么建表格
HTML
script language="javascript"
var tableObj = null;
function newTable(){
tableObj = document.createElement( "table" );
tableObj.border = "1";
divObj.appendChild( tableObj );
newRow.style.display = "block";
};
function AddRow(){
if( tableObj == null )
newTable();
var trObj = tableObj.insertRow(); // 加一行
for(var i = 0; i 3; i ++){
var tdObj = trObj.insertCell(); // 加一列
tdObj.innerText = tableObj.rows.length + "_" + (i + 1);
}
};
/script
BODY
button onclick="newTable()"创建表格/buttonbutton id="newRow" style="display: none;" onclick="AddRow()"添加新行/button
div id="divObj"/div
/BODY
/HTML
