trHtml="<tr>"+
"<th style='width: 5%'><input class='awsui-checkbox' id='checkboxStyle' value='' type='checkbox'/></th>"+
"<th style='width: 6%'>序号</th>"+
"<th style='width: 8%'>类型</th>"+
"<th style='width: 23%'>公司</th>"+
"<th style='width: 23%'>付款方</th>"+
"<th style='width: 12%'>金额</th>"+
"<th style='width: 15%'>日期</th>"+
"<th style='width: 8%'>状态</th>"+
"</tr>"
$("thead").append(trHtml)
直接用<input class='awsui-checkbox' id='checkboxStyle' value='' type='checkbox'/>就好
代码如下:
<script>
//js放到table下,才能检测到tr数组
var trs = document.getElementById("tableBox").getElementsByTagName("tr")
var trs=document.getElementById("tableBox").getElementsByTagName("tr")
$(function(){
for(var i=0i<trs.lengthi++){
trs[i].onmousedown = function(){
mousedownclick(this)
}
}
})
function mousedownclick(obj){
for(var j=0j<trs.lengthj++){
if(trs[j]==obj){
trs[j].style.background='blue'
}else{
trs[j].style.background=''
}
}
}
</script>
扩展资料
js操作table的各种用法:
(1)得到table 中tbody 的内容 :$('#simple-table').find('tbody').html()
(2)点击td时,获取点击的行号:
$('#simple-table tbody').on( 'click', 'td', function (e) {
normalRowIndex = $(this).parent().index()//行号
console.log("正常工作表行:"+normalRowIndex)
})
(3)为table追加一行:
function addNormalTR(){
$('#simple-table').find('tbody').append(trtd)//tdtd为拼接的trtd 的html内容。
}
(4) 点击td中的元素获取,当前行号: obj.parentNode.parentNode.rowIndex//obj 为元素对象
function init()
{
vartable =document.getElementById("tab1")
varrows = table.rows.length
alert('行数'+rows)
varcolums = table.rows[0].cells.length
alert('列数'+colums)
}
----根据列数自动循环显示隐藏