jq获取所有表格.doc
文本预览下载声明
jq获取所有表格
篇一：js获取html表格的值
lt;!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN /TR/html4/loose.dtd
lt;html
lt;head
lt;meta http-equiv=Content-Type content=text/html; charset=gb2312 lt;titleJavaScriptlt;/title
lt;style type=text/css
table{
margin:10px auto;
text-align:center;
width:600px;
height:320px;
}
td{
border:1px solid #333;
}
lt;/style
lt;script type=text/javascript
functioninitEvent() {
vartds=document.getElementsByTagName(td);
for(vari=0; ilt;tds.length; i++) {
var td=tds[i];
td.onclick=btnClick;
}
}
functionbtnClick() {
vartds=document.getElementsByTagName(td);
for(vari=0; ilt;tds.length; i++) {
var td=tds[i];
if(td==window.event.srcElement) {
alert(td.innerText);
}
}
}
lt;/script
lt;/head
lt;body onload=initEvent()
lt;table
lt;captionlt;h3请点击表格中的数字lt;/h3lt;/caption
lt;trlt;td111lt;/tdlt;td222lt;/tdlt;td333lt;/tdlt;/tr
lt;trlt;td444lt;/tdlt;td555lt;/tdlt;td666lt;/tdlt;/tr
lt;trlt;td777lt;/tdlt;td888lt;/tdlt;td999lt;/tdlt;/tr
lt;/table
lt;/body lt;/html
篇二：Jquery常用表格汇总
虽然现在DIV+CSS进行页的布局大行其道，但是很多地方使用table还是有很多优势，用table展示数据是比较方便的，下面汇总了jQuery操作Table tr td常用的方法，熟记这些操作技巧，下次再使用的到时候，会让你如鱼得水，提高开发效率。
1.鼠标移动行变色
$(#table1 tr).hover(function(){
$(this).children(td).addClass(hover)
},function(){
$(this).children(td).removeClass(hover)
})
方法二：
$(#table1 tr:gt(0)).hover(function() {
$(this).children(td).addClass(hover);
}, function() {
$(this).children(td).removeClass(hover);
});
2.奇偶行不同颜色
$(#table1 tbody tr:odd).css(background-color, #bbf);
$(#table1 tbody tr:even).css(background-color,#ffc);
$(#table1 tbody tr:odd).addClass(odd)
$(#table1 tbody tr:even).addClass(even)
3.隐藏一行
$(#table1 tbody tr:eq(3)).hide();
4.隐藏一列
$(#table1 tr td::nth-child(3)).hide();
方法二：
[html]view plain copy
$(#table1 tr).each(function(){$(td:eq(3),this).hide()});
5.删除一行
//删除除第一行外的所有行
$(#table1 tr:not(:first)).remove();
//删除指定行
$(#table1 tr:eq(3)).remove();
6.删除一列
//删除除第一列外的所有列
$(#table1 tr th:not(:nth-child(1))).
显示全部