加速JavaScript / jQuery功能

Question

我知道你可以使用“var = $ xxx”在jquery / javascript中缓存选择器。我已经对所有将被使用多次的选择器做了这个...

问题：首次访问者通过点击激活该功能时，javascript动画很慢。下次他们点击它时没有任何犹豫。

由于我对JavaScript不太了解，我想知道这是因为下面的A或B：

答：这是因为浏览器仅在访问者“点击”时才会缓存选择器。

B：这是因为浏览器会记住功能/动画。

问A是否为真：

有没有办法在点击功能之前缓存所有选择器？

有没有办法让浏览器在下次访问网站之前记住缓存的选择器？

问B是否属实：

我可以以某种方式缓存JavaScript中的函数吗？

或者我可以展示访问者到达时如何运行所有功能（例如，首先弹出一个带有z-index 10000的加载div并运行其背后的所有功能）。

以下是一些示例代码：

$(document).ready(function(){

var $selector1 = $('#div1'),
$selector2 = $('#div2');

$selector1.click(function(){
$selector2.animate({height:'toggle'},350)
});

});

抱歉我的英语不好。

Answer 1

希望这些评论能回答你关于jQuery缓存的问题。正如他们所说，你的代码似乎很好，所以它可能是浏览器的一个问题。

如果要在页面加载时显示加载图像，可以在页面开头添加加载图像：

<div id="loader">
<img src="loader.gif" alt="Loading..." />
</div>

然后使用CSS来设置它的样式：

#loader {
   z-index: 100;
   position: fixed;
   top: 50%;
   left: 50%;
   margin-left: -10px; //(or half the width of your loader image)
}

然后添加jQuery函数以在页面加载后隐藏它：

jQuery(window).load(function() {
   jQuery('#loader').hide();
});