&引用；“加载更多”；使用jQuery+；AJAX+；XML

我正在制作一个网站，在一个页面中显示大量文档（PDF和JPG），我担心页面加载时间和服务器加载，因为有很多文件。 我将文件数据存储在XML文件中，并使用jQuery和AJAX检索数据

jQuery：

$(document).ready(function() {
    $.ajax({
        type: "GET",
        url: "scripts/imagenes.xml",
        dataType: "xml",
        success: function(xml) {
            $(xml).find('imagen').each(function() {
                var path = $(this).find('path').text();
                var img = $(this).find('img').text();
                var thumb = $(this).find('thumb').text();
                $('<a rel="lightbox" href="'+path+img+'">').html('<img src="' + path + thumb + '" /></a>').appendTo(".item_aesmr_img_hola");
            });
        }
    });
});

$（文档）.ready（函数（）{
$.ajax({
键入：“获取”，
url:“scripts/imagenes.xml”，
数据类型：“xml”，
成功：函数（xml）{
$（xml）.find（'imagen'）.each（function（）{
var path=$（this.find（'path'）.text（）；
var img=$（this.find（'img'）.text（）；
var thumb=$（this.find（'thumb'）.text（）；
$（''）。附于（“.项目”）；
});
}
});
});

XML:

文件/aesmr/carnets/
aesmr-carnet-016b.jpg
拇指/aesmr-carnet-016b.jpg
文件/aesmr/carnets/
aesmr-carnet-025b.jpg
拇指/aesmr-carnet-025b.jpg
等等

我认为使用典型的

Load more…

按钮是一个不错的主意，它只允许用户在需要时加载图像，每次增加20个图像。我加载拇指，点击缩略图时加载完整图像

---

有没有办法只加载前20个结果，然后使用按钮再显示20个结果？

一个选项是在“每个”块中添加计数器。因此，当您达到20岁时，您将终止脚本的执行

<?xml version="1.0" encoding="UTF-8"?>
<instituciones>
  <aesmr>
    <carnets>
      <imagen>
        <path>docs/aesmr/carnets/</path>
        <img>aesmr-carnet-016b.jpg</img>
        <thumb>thumbs/aesmr-carnet-016b.jpg</thumb>
      </imagen>
      <imagen>
        <path>docs/aesmr/carnets/</path>
        <img>aesmr-carnet-025b.jpg</img>
        <thumb>thumbs/aesmr-carnet-025b.jpg</thumb>
      </imagen>
      ...and so on...
    </carnets>
  </aesmr>
</instituciones>