本文目录一览：
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获得表单中某个单元格的值
javascript提供了获取表格中某一行单元格数的代码，参考如下：
document.getElementById(‘first’).cells.length // 获取id为first的行的单元格数目
实例演示如下：
创建Html元素
div class=”box”
span实例演示：获取表格第一行的单元格数量/span
div class=”content”
table
tr id=”first”td1/tdtd2/tdtd3/td/tr
trtd4/tdtd5/tdtd6/td/tr
trtd7/tdtd8/tdtd9/td/tr
/table
input type=”button” value=”获取表格第一行的单元格数量” onclick=”fun_get()”
/div
/div
简单设置一下css样式
div.box{width:300px;padding:20px;margin:20px;border:4px dashed #ccc;}
div.boxspan{color:#999;font-style:italic;}
div.content{width:250px;margin:10px 0;padding:20px;border:2px solid #ff6666;}
table{border-collapse:collapse;}
td{width:80px;height:30px;line-height:30px;text-align:center;border:1px solid green;}
编写jquery代码
script
function fun_get(){
alert(document.getElementById(‘first’).cells.length);
}
/script
js怎么获取表格中指定行某一列的值？
jQuery 遍历的 eq() 方法将匹配元素集缩减值指定 index 上的一个，index表示元素的位置（最小为 0）。所以获取Table第 i 行第 j 列的内容可用如下代码
$(“table”).find(“tr”).eq(i-1).find(“td”).eq(j-1).text(); // 注意-1是因为index从0开始计数。
div class=”box”span填写行列数，点击按钮后获取对应位置的数值：/spandiv class=”content”tabletrtd1/tdtd2/tdtd3/td/trtrtd4/tdtd5/tdtd6/td/trtrtd7/tdtd8/tdtd9/td/tr/table/div
第input type=”text” name=”row”行，第input type=”text” name=”col”列input type=”button” class=”btn” value=”确定”/div
添加css样式
div.box{width:300px;height:250px;padding:10px 20px;border:4px dashed #ccc;}
div.boxspan{color:#999;font-style:italic;}
div.content{width:250px;height:100px;margin:10px 0;padding:5px 20px;border:2px solid #ff6666;}
input[type=’text’]{width:35px;height:30px;border:1px solid #99ccff;}
input[type=’button’]{width:100px;height:30px;margin:10px;border:2px solid #ebbcbe;}
.selected{background:#99ccff;}
table{border-collapse:collapse;}
td{padding:5px 10px;border:1px solid green;}。
用js获取表格中的值，写出代码
你可以doucment.getElementById(tdId).innerHTML得到指定单元格的值。你也可以doucment.getElementById(tableId)得到table对象(DOM)，对它的childNodes进行迭代(得到表格的行tr的DOM对象)，再对tr对象的childNodes进行迭代，得到单元格td的DOM对象，这样就可以取到单元格的值了
原创文章，作者：TGFDG，如若转载，请注明出处：https://www.506064.com/n/317772.html
微信扫一扫 
支付宝扫一扫 