javascript-将数组拆分为多个页面索引

Question

I have a function called Render(arr). Arr is a parameter that contain 50 rows of data. I have an empty div in html page

<div id="test"></div>

when I use this javascript code

var s=""
for(i<0;i<arr.length;i++{
    s+= arr[i].attr1.toString();
    s+= arr[i].attr2.toString();
    s+= arr[i].attr3.toString();
}
var data = document.getElementById("test");
data.innerHTML = s;

It will render all the 50 rows of data along with the attributes in a html page which is space-consuming. How to make page indexing if i want to split the array into page indexing that a page only contain 5 data? eg page 1 only show data row 1-5, page 2 only show data row 6-10 without refreshing the page?

thanks

Answer 1

var page = curr_page - 1;
for(i=page*5;i<page*5+5;i++{
    s+= arr[i].attr1.toString();
    s+= arr[i].attr2.toString();
    s+= arr[i].attr3.toString();
}

Something like this?

if curr_page = 1 the for will loop 5 times, from 0 to 5

if its 2 it will loop from 5 to 10 and so on.

Answer 2

for(var i = current_page * 5 - 5, j = 0; j < 5; j++, i++) {
  s += arr[i].attr1.toString();
  s += arr[i].attr1.toString();
  s += arr[i].attr1.toString();
}