4

此函数为图像列表克隆声音对象。

问题是当对象写入 DOM 时，浏览器查询服务器将其加载为 200 请求。但是，它只是一遍又一遍地加载 4 个不同的声音文件。所以它应该从浏览器的缓存中加载为 304 请求。

所有声音文件最初都以 HTML 格式加载，然后被克隆。每当刷新页面时，HTML 中的声音文件都会收到 304 请求并从缓存中加载，但任何克隆的文件都会使用 200 请求（不是从缓存中）加载！

无论如何，我在没有浏览器向服务器发送请求以加载到 DOM 的情况下克隆这些对象吗？完全在客户端？数据已经在 HTML 中写入一次。

我宁愿根本不向服务器发送任何请求来克隆这些对象。由于它克隆了超过 50 个，因此一秒钟内有 50 个请求被发送到服务器。重载它。

var increment = 0;
$("img").each(function(i) { //loop for each item
    if (increment > 4){
        increment = 0;  
    }

    if (i != 0) {  //only clone if there are more than one 'img' items      
        $("#hover-" + increment)  //item to clone     
          .clone(true)
          .attr("id", "beep-" + i)  //new name of object
          .appendTo($(this).parent()); 
    }

    $(this).data("instance", i);  //save the integer for loop
    increment=Math.floor(Math.random()*3);  //change increment
})
4

1 回答 1

0

除非图像缓存在浏览器中，否则每个图像/声音文件引用都将在对服务器的请求中解析。您可以设置图像的“Expires”和“Cache-Control”标头以强制缓存。当您请求图像时，这些标头是从服务器发送的。

另一种选择是使用 Memcache 之类的东西来缓存图像服务器端。这样，每个图像引用仍将解析到服务器，但图像将被缓存在服务器端以便更快地访问。

有关更多信息，请参阅缓存种类、Web 缓存如何工作、如何（以及如何不）控制缓存http://www.mnot.net/cache_docs/

于 2011-10-12T21:09:07.860 回答