javascript - 通过 AJAX 加载文件一部分的最快方法？

Question

我有很多文本文件中的书籍。

我已在网站上列出了该书的索引。

理论是:从包含整本书的文本文件中加载该索引中的部分书籍。

书籍索引(例如我们有 3 个索引):

<ul>
   <li><a onClick="return LoadThis('a1')">INDEX-1</a><div id="loader1" ></div></li>
   <li><a onClick="return LoadThis('a2')">INDEX-2</a><div id="loader2" ></div></li>
   <li><a onClick="return LoadThis('a3')">INDEX-3</a><div id="loader3" ></div></li>
</ul>

JavaScript 代码:

var loadUrl = "http://www.website.com/books/the-book.php";

function LoadThis(link_anchor)
{
var loader="#loader"+link_anchor.substring(1);
$(loader).html(ajax_load).load(loadUrl+" #"+link_anchor);

$(loader).addClass('ajax-active');
}

The-Book.PHP 文件

<div id="a1"><p>Index-1 texts...</p></div>
<div id="a2"><p>Index-2 texts ....</p></div>
<div id="a3"><p>Index-3 texts ....</p></div>

问题: 负载通常都不错!并且他们的负载工作良好。但是...

如果 The-Book.php 的索引数量和文件大小越来越大，加载速度会比小书慢。

问题: 我使用 AJAX LOAD 功能的编程方法是标准方法吗？

有没有更好、更标准、更快的方法来做到这一点？

请帮助我。

Answer 1

与 .load() 合作无论如何，它本身并不是一个坏习惯，但就您而言，它并不是真正理想的做法。

当您使用 .load() 获取页面时并指定一个选择器来标识您要插入的部分，您可能认为它只会下载文件的该部分。由于 jQuery 无法知道选择器在文件中的位置(或者是否在多个位置)，因此即使您只想要文件的第一(或最后)部分，也必须下载整个文件。

因此，如果您有一本大书(例如几百千字节)并且没有为您的书进行缓存，您将需要多次下载大量数据才能填充页面上的所有部分。

如果您确实想要进行部分加载，那么您需要在硬盘上创建单独的文件并每次加载每个部分的正确文件，或者您可以让 php 文件过滤结果并仅返回请求的部分.

如果您想使用 php 进行过滤，那么您可以看看 How do you parse and process HTML/XML in PHP?有关解析 html/xml 的更多信息。