jstr控制下面的tbody隐藏和显示_javascript技巧

来源：动视网责编：小采时间：2020-11-27 20:39:41

jstr控制下面的tbody隐藏和显示_javascript技巧

jstr控制下面的tbody隐藏和显示_javascript技巧:用的核心代码function $(obj){ return document.getElementById(obj); } window.onload = function(){ var table = document.getElementById(myTable); //如果在表格区域内产生单击 table.onclick = func

推荐度：

点击下载本文 文档为doc格式

导读jstr控制下面的tbody隐藏和显示_javascript技巧:用的核心代码function $(obj){ return document.getElementById(obj); } window.onload = function(){ var table = document.getElementById(myTable); //如果在表格区域内产生单击 table.onclick = func

用的核心代码
function $(obj){
return document.getElementById(obj);
}
window.onload = function(){
var table = document.getElementById("myTable");
//如果在表格区域内产生单击
table.onclick = function(e){
var e = window.event||e,target = e.srcElement||e.target;

//得到tr
while(target.tagName.toLowerCase() != "tr"){
target = target.parentNode;
}

var i = target.rowIndex;
//单击单行的Tr的话就是控制tr + 1的隐藏和显示

if(i%2 == 0){
var nrs = table.rows[i + 1].parentNode.style;
nrs.display = nrs.display == "none"?"":"none";
}
}
}

<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>层隐藏</title> </ script> </head> function $(obj){ return document.getElementById(obj); } window.onload = function(){ var table = document.getElementById("myTable"); //如果在表格区域内产生单击 table.onclick = function(e){ var e = window.event||e,target = e.srcElement||e.target; //得到tr while(target.tagName.toLowerCase() != "tr"){ target = target.parentNode; } var i = target.rowIndex; //单击单行的Tr的话就是控制tr + 1的隐藏和显示 if(i%2 == 0){ var nrs = table.rows[i + 1].parentNode.style; nrs.display = nrs.display == "none"?"":"none"; } } } </ script> <body> <table border="1" id="myTable"> <tr><td>脚本</td></tr> <tbody style="display:none"> <tr><td>脚本之家</td></tr> </tbody> <tr><td>小说</td></tr> <tbody style="display:none"> <tr><td>看书了文学网</td></tr> </tbody> </table> </body> </html>
[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

jstr控制下面的tbody隐藏和显示_javascript技巧

推荐度：

点击下载本文 文档为doc格式

标签： js javascript tr

热门焦点

jstr控制下面的tbody隐藏和显示_javascript技巧

jstr控制下面的tbody隐藏和显示_javascript技巧

jstr控制下面的tbody隐藏和显示_javascript技巧

最新推荐

猜你喜欢

热门推荐