javascript - 创建一个包含整个站点使用的所有图像的数组

Question

我希望能够预加载网站所有页面中使用的所有图像。

我的想法是创建一个包含所有这些图像的数组。

完成这项任务的最佳方法应该是什么？

例如，这可能是一个天真的问题，有没有办法使用 JavaScript 来确定同一域内网站所有页面中使用的所有图像文件？

或者，是否有一种方法，例如，创建某个文件夹中包含的所有图像的数组？

预先感谢您的帮助!

Answer 1

理论上，您可以仅使用 JavaScript 来完成这样的事情。在页面加载(或文档准备就绪，或其他)时，脚本可以:

1. 使用getElementsByTagName()获取页面上的所有链接
2. 执行XMLHttpRequest对于href它找到的每个同域链接。
3. 查看 <img> 的每个回复标签，并预加载每个标签。
4. 查看 <a> 的每个回复标签，然后重复。

但是，在服务器上维护或生成整个站点使用的图像 URL 列表，并将该列表作为 JavaScript 数组包含在脚本中，以避免所有疯狂的 AJAX 图像查找，会更有效。

您希望在网站的每个页面上包含此脚本(因为您永远不知道用户将在您的网站上启动哪个页面)，但在运行时保存一个 cookie(这样它就不会重新启动)在给定用户访问的每个页面上运行)。

不过我会仔细考虑一下。某些用户可能使用互联网连接，其数据使用受到限制，或者按兆字节收费。您确定所有用户都希望通过访问一个页面来下载您网站上的每张图片吗？