js隐藏和显示表格

最新推荐文章于 2022-01-04 17:58:39 发布

原创最新推荐文章于 2022-01-04 17:58:39 发布 · 4k 阅读

0 ·

CC 4.0 BY-SA版权

本文介绍了一种使用JavaScript来控制HTML表格中TR元素显示与隐藏的方法。通过内联样式设置所有TR初始状态为不显示，然后利用JavaScript在页面加载完成后使所有TR元素重新显示出来。这种方式有助于改善用户体验并实现动态效果。

		<style>
		body{font-size:30px;}
		tr{display:none}
		input{width:400px;height:50px;font-size:30px;}
		</style>

这样使得tr都不显示。

通过

<script>
        	window.onload = function init() {
				var trs = document.getElementsByTagName("tr");
				
				
				for (var i = 0; i < trs.length; i++) {
					trs[i].style.display="table-row";
				}
				alert("trs = " + trs.length);

			}
        </script>

这段js代码使得都能够显示