Javascript - 用30步增量創建一個for循環

Question

我試圖用30步增量創建一個for-loop。這樣做的目的是希望在不使用任何插件的情況下將其用於非常簡單和原始的分頁。

首先我有一個無序的HTML列表：

<ul id="pagination"></ul> 

這是我用它來填充列表，並設置元素的屬性代碼。爲了解決這個問題，使用了data-skip和data-top，但實際上它們稍後會被添加到url，以便REST調用來獲取數據。

var total = 115; 
var intervalo = Math.ceil(total/30); 
var pagination = document.getElementById('pagination'); 

for (var c = 1; c <= intervalo; c++) { 
    var top = c * 30; 
    var skip = (c * 30) - 30; 
    console.log('&$skip=' + skip + ' &$top=' + top); 
    var li = document.createElement('li'); 
     li.id = c; 
     li.setAttribute('data-skip', '&$skip=' + skip); 
     li.setAttribute('data-top', '&$top=' + top); 

    var a = document.createElement('a'); 
     a.href = '#'; 
     a.textContent = c; 

     li.appendChild(a); 
     pagination.appendChild(li); 
} 

上面的代碼返回此控制檯：

&$skip=0 &$top=30 
&$skip=30 &$top=60 
&$skip=60 &$top=90 
&$skip=90 &$top=120 

但是這是問題。如果您注意到&$skip總是匹配以前的&$top。實際上我需要的是這樣回到類似的東西：

&$skip=0 &$top=30 
&$skip=31 &$top=60 
&$skip=61 &$top=90 
&$skip=91 &$top=120 

我該如何做到這一點？我覺得我快到了，但我不明白。如果需要其他細節，請告訴我們謝謝！

Answer 1

我想我想通了。這可能不是最好的選擇，但它現在對我有用。希望能幫助別人，甚至有人會提供比我更好的答案。我創建了一個數組，然後我進行操作。

var total = 115; 
var intervalo = Math.ceil(total/30); 
var pagination = document.getElementById('pagination'); 
var range = []; 

for (var c = 1; c <= intervalo; c++) { 
    var top = c * 30; 
    var skip = (c * 30) - 30; 
    range.push({ 
     skip: skip, 
     top: top 
    }); 
    // console.log('&$skip=' + skip + ' &$top=' + top); 

var li = document.createElement('li'); 
    li.id = c; 
    li.setAttribute('data-skip', '&$skip=' + skip); 
    li.setAttribute('data-top', '&$top=' + top); 

var a = document.createElement('a'); 
    a.href = '#'; 
    a.textContent = c; 

    li.appendChild(a); 
    pagination.appendChild(li); 

    } 

console.log(JSON.stringify(range)); 

for (var r = 1; r < range.length; r++) { 
    range[r].top = range[r].top - 1; 
} 
console.log(JSON.stringify(range)); 

Answer 2

30，而不是c++只是增加：

for (var c = 1; c <= total; c+=30)