如何在javascript中在表上添加滚动条（以及在滚动条上应用条件）？

这里，我有10个Json对象。我试图在表格上添加一个滚动条，带有

溢出：auto

，但这里有一个转折点，我想要的是当我的滚动条触底时，我想要设置一个类似上10个值的条件再次重复，但只有当滚动条触底时，我希望它处于无限循环中

到目前为止我做了什么 这里我将JSON对象放在数组中

var response = [
  {
     "CategoryName":"Beverages",
     "ProductName":"Steeleye Stout"
  },
  {
     "CategoryName":"Beverages",
     "ProductName":"Laughing Lumberjack Lager"
  },
  {
     "CategoryName":"Beverages",
     "ProductName":"Lakkalik\u00f6\u00f6ri"
  },
  {
     "CategoryName":"Beverages",
     "ProductName":"Guaran\u00e1 Fant\u00e1stica"
  },
  {
     "CategoryName":"Beverages",
     "ProductName":"Ipoh Coffee"
  },
  {
     "CategoryName":"Beverages",
     "ProductName":"Chang"
  },
  {
     "CategoryName":"Beverages",
     "ProductName":"Chartreuse verte"
  },
  {
     "CategoryName":"Beverages",
     "ProductName":"Ipoh Coffee"
  },
  {
     "CategoryName":"Beverages",
     "ProductName":"Chai"
  },
  {
     "CategoryName":"Beverages",
     "ProductName":"Chang"

  }
  ]

现在我创建了i表，但我也希望对其进行更改，我只希望在第一位有5个条目。接下来的5个条目，我希望从滚动条访问

var key = [];

       document.write("<table border==\"1\"><tr>");
       for (key in response[0]) {
       document.write('<td>' + '<b>' + key + '</b>' + '</td>');
        }

        document.write("</tr>");
        for (var i = 0; i < response.length; i++) {
        document.write('<tr>');
        for (key in response[i]) {

             document.write('<td>' + response[i][key] + '</td>'); 
         }
        document.write('</tr>');
          }
        document.write("</table>");

var-key=[]；
文件。填写（“”）；
for（输入响应[0]）{
文件。写入（“”+“”+键+“”+“”）；
}
文件。填写（“”）；
对于（变量i=0；i

我希望你们明白我想问什么。提前感谢：）

.scrobale表格{边距：0；填充：0；显示：块；最大宽度：100%；}
斯克罗贝尔先生{
最大高度：200px；
高度：自动；
显示：块；
溢出：自动；
最大宽度：300px；
}

Swiper演示
斯克罗贝尔先生{
最大高度：200px；
高度：自动；
显示：块；
溢出：自动；
}
var响应=[
{
“类别名称”：“饮料”，
“产品名称”：“Steeleye Stout”
},
{
“类别名称”：“饮料”，
“产品名称”：“大笑的伐木工人啤酒”
},
{
“类别名称”：“饮料”，
“产品名称”：“Lakkalik\u00f6\u00f6ri”
},
{
“类别名称”：“饮料”，
“产品名称”：“Guaran\u00e1 Fant\u00e1stica”
},
{
“类别名称”：“饮料”，
“产品名称”：“怡保咖啡”
},
{
“类别名称”：“饮料”，
“产品名称”：“Chang”
},
{
“类别名称”：“饮料”，
“产品名称”：“Chartreuse verte”
},
{
“类别名称”：“饮料”，
“产品名称”：“怡保咖啡”
},
{
“类别名称”：“饮料”，
“产品名称”：“Chai”
},
{
“类别名称”：“饮料”，
“产品名称”：“Chang”
}
]
var键=[]；
文件。填写（“”）；
for（输入响应[0]）{
文件。写入（“”+“”+键+“”+“”）；
}
文件。填写（“”）；
对于（变量i=0；i=$（此）[0].scrollHeight）{
//警报（“在此处添加您的表tr”）；
$（“.scrobale table tbody”）.prepend（contentvalue）；
}
})
});

我想这个链接会对你有所帮助。这是完美的，我现在唯一想要的是，当我的滚动条触底的时候，我想一次又一次地加载相同的10个条目。我试过了，但我可以把这些事件结合起来。你能帮我吗。谢谢你的想法，我希望在无限循环中出现这种情况，比如当我的滚动条在底部反应时，整个10个条目再次重复，或者我们可以说自动填充。是的，这次更好，最后也是唯一的问题。是否可以一次又一次地获取categoryName和Product Name的值。我不想一次又一次地打印标题。只是entriesBro，但顺便问一下，现在是否可以将滚动条与表格一起放置？表格在左侧，滚动条在右侧。是的，这是可能的。请检查我是否更新了代码段。