点击按钮查看更多的JS代码实现方法

点击按钮查看更多,循环全部隐藏或显示jquery, each(function(i){})

页面上有10行,但我默认只显示5行,点击查看更多后,另外5行才显示出来,怎么实现呢 

实现方法的JS代码如下 

注意,需要先引入jq插件

<tr  id="tr" style="display:none">       
  <td >第一行</td> 
  </tr> 
  <tr  id="tr" style="display:none">         
  <td >第二行</td> 
  </tr> 
 
  <tr><td><span id="more">查看更多</span></td></tr> 
 
 
  <script> 
      $("#more").click(function(){ 
  $("tr[id='tr']").each(function(i){ 
$(this).show();//hide(); 
});  
}); 
</script>

点击展示/收起代码：

<div id="a" style="height:100px;width:200px;overflow:hidden;">
测试内容
</div>
<a href="javascript:void(0)" id="show" onclick="document.getElementById('a').style.height='500px';document.getElementById('hidden').style.display='';document.getElementById('show').style.display='none';">展开</a>
<a href="javascript:void(0)" id="hidden" style="display:none;" onclick="document.getElementById('a').style.height='100px';document.getElementById('hidden').style.display='none';document.getElementById('show').style.display='';">关闭</a>