页面上有600个tr,id分别为id1,id2...id600
问题是我想控制这600个tr同时隐藏或者同时显示
用prototype中的 $
for (var i = 1; i <= 600; i++) {
$('tr_' + i).style.display = '';
}
这样会有大约5秒的延迟,浏览器没法反应
请问大侠有没有什么方法能缩减这些时间呢
我用document.getElementById()也没什么用
通过CSS控制,比较:
[code="java"]
table.hideTr tr.hide{ display:none; } //插入500行 function insertRows(){ for(var i=0;i<500;i++){ var row = tb1.insertRow(); row.insertCell().innerHTML=i; if(i%2==0){//偶数列用样式控制 row.className="hide"; } } spanRowCount.innerHTML=tb1.rows.length; } //预插入500行 window.onload=function(){ insertRows(); } //通过class控制偶数行 var isShow0=true; function changeClass(){ isShow0=!isShow0; var d = new Date(); tb1.className= isShow0 ? "" : "hideTr" ; span0.innerHTML= new Date() - d; } //通过style控制奇数行 var isShow1=true; function changeStyle(){ isShow1=!isShow1; var d = new Date(); for(var i=0;i<tb1.rows.length;i++){ if(i%2==1){//控制奇数列的显隐 tb1.rows[i].style.display = isShow1 ? "" : "none"; } } span1.innerHTML= new Date() - d; }
</head>
<body>
总行数:
用时:
用时:
[/code]
用JQuery
直接让table隐藏或者显示不也可以么
[code="java"]
$("tr[id^='id']").hide();//选择id以“id”开头的所有TR并隐藏
[/code]
上面的代码是JQuery的写法,论选择器来说JQuery无疑是最强大的,嘿嘿!
如果用prototype,你试试把所有tr放在tbody里面,然后直接隐藏tbody。
也可以吧tr放在另外一个table里面,然后隐藏这个table。
[code="html"]
[/code]
集思广益:
[code="html"]
function createTable(){ var arr = []; for(i=0;i<=600;i++){ arr[i] = "<tr id="+i + "><td>"+i+"</td></tr>" } //alert(arr.join("")) document.getElementById("tb").innerHTML = "<table width=700 border=1>"+ arr.join("") +"</table>" }
[/code]