使用jQuery显示表中的特定行

Question

我正在尝试显示一个包含100行的表，我想显示前20行并首先隐藏其他行。然后在此之后的20行中直到我们达到100行...我是使用jQuery的新手所以我不知道该怎么做，我已经尝试过类似的方法，但是它肯定是错误的

  

PHP

<?php 
 $sql = "SELECT *, ROW_NUMBER() OVER(ORDER BY jloc_title ASC) AS  Rownum,jloc_id, jloc_title 
FROM Locations";
$stmt = sqlsrv_query($connection,$sql);
if($stmt == false)
{
 echo"Error (sqlsrv_query):".print_r(sqlsrv_errors(),true);
 exit;
}
while($row1=sqlsrv_fetch_array($stmt))
    {
    $id = $row1[0];
    $title = $row1[1];
    $Rownumber = $row1[2];              
    echo"<tr id='Row' value='".$Rownumber."'    >";
    echo"<td class='text-center'> " .$Rownumber.  "</td>";
    echo"<td class='text-center'> " .$id. "</td>";
    echo"<td class='text-center'> " .$title. "</td>";
    echo"</tr>";
    }
?>

  

jQuery

$(document).ready(function(){
var number = document.getElementById("table1").rows.length ;
var counter= 0 ;
for (i=0; i<=number; i+=20) {   
    if (counter == 0) { 
        if (number > 20) {  
            var $rows = $("#table1 tr");
            $rows.eq(21).hide();
            ...
            $rows.eq(100).hide();
        }
        counter++;
    }
    else if (counter == 1) {
        while (counter == 1 ) {
            if (number > 40 ) {
                var $rows = $("#table1 tr");
                $rows.eq(0).hide();
                ...
                $rows.eq(21).hide();
                $rows.eq(60).hide();
                ...
                $rows.eq(100).hide();                                   
            }
            counter++;
        }
    } else {
        ...
    }

    setInterval(function(){location.reload();}, 1000*10);
}
});