189 8069 5689
在head标签中加入
创新互联公司专注于凭祥网站建设服务及定制，我们拥有丰富的企业做网站经验。 热诚为您提供凭祥营销型网站建设，凭祥网站制作、凭祥网页设计、凭祥网站官网定制、小程序制作服务，打造凭祥网络公司原创品牌,更为您提供凭祥网站排名全网营销落地服务。
script type="text/javascript" src=""/script
即可。
src中可以根据需要选择不同版本的jquery。
jquery预加载的两种方式说明如下：
1、通过写函数进行预加载
function preload(arrayOfImages) {
$(arrayOfImages).each(function(){
$('img/')[0].src = this; //循环加载传进来的图片数组
});
}
调用方法：
preload([
'img/imageName.jpg', //图片1
'img/anotherOne.jpg',//图片2
'img/blahblahblah.jpg'//图片3
]);
2、通过插件的方式预加载
//自定义函数preload，实现原理跟方法一差不多
$.fn.preload = function() {
this.each(function(){
$('img/')[0].src = this;
});
}
调用方法：
$(['img1.jpg','img2.jpg','img3.jpg']).preload();
jquery是等待页面加载完数据，以及页面部分元素；js是页面全部加载完成才执行初始化加载，具体示例祥看本文
jquery和js初始化加载页面的区别：
jquery：等待页面加载完数据，以及页面部分元素（不包括图片、视频），
js：是页面全部加载完成才执行初始化加载。
1、jQuery
页面加载初始化的方法有3种
，页面在加载的时候都会执行脚本,
第一种(比较常用)：
代码如下:
$.function(){
alert("第一种方法");
});
第二种：
复制代码
代码如下:
$(document).ready(function(){
alert("第二种方法");
});
第三种：
代码如下:
jQuery(function($){
alert("第三种方法");
});
2、js初始化加载的方法
第一种：
代码如下:
window.onload=function(){
alert("初始化加载");
};
第二种：
(winOnload
此方法名自定义)
代码如下:
function
winOnload()
{
alert("初始化加载");
};
winOnload();
注意：
由于jquery使用$符号，和有些组件例如dwr就有冲突，为了解决这个问题，可以使用
代码如下:
var
ace=jQuery.noConflict();
目前jquery 已经达到了上百K。min压缩版本也很大
所以下面说一下如何 提高 jquery在网站的加载速度：
1 使用合适的版本，不一定最新的jquery库就最适合你的网站。可能你的js代码，可能只需要一个1.6版本的Jquery。但是却引用了一个1.8版本的jquery。无意中体积增加了几十K.
2 发布网站之后，使用 min版本。
如图 压缩版本和未压缩版本，体积差了180K。
3 如果网站带宽比较紧张或是所在机房不是全网机房。可以使用jquery CDN加速。
让CDN加速给客户端浏览器下载jquery，可以减少不少带宽。
CND jquery 网址：（直接在jquery 官网，download页面即可）
JQ官网提供CND加速，google，microsoft 也提供。
请通过chrome的调试器，查看各个CDN的加载时间，综合选择适合自己网址的Jquery加速服务
1和2是一样的，2是1的简化写法。
页面加载就是页面的整体Dom结构都已加载到内存。对于jquery而言，还包括jquery自身的内部对象都已准备完毕，所以与window.onload还是有所区别的，但大致意思都差不多。
依赖 (dependence)
Zepto 或者 jQuery 1.7以上版本，推荐jQuery 2.x版本（二者不要同时引用）
Zepto or jQuery 1.7+，recommend to use jQuery 2.x（not use them at the same time）
使用方法 (usage)
引用css和js
(basic)
12
link rel="stylesheet" href="../dist/dropload.css"script src="../dist/dropload.min.js"/script
1234567891011121314151617181920
$('.element').dropload({ scrollArea : window, loadDownFn : function(me){ $.ajax({ type: 'GET', url: 'json/more.json', dataType: 'json', success: function(data){ alert(data); // 每次数据加载完，必须重置 me.resetload(); }, error: function(xhr, type){ alert('Ajax error!'); // 即使加载出错，也得重置 me.resetload(); } }); }});
（注明：所有示例里ajax和setTimeout都是为了模拟加载效果而写的，与本插件无直接关系。ajax建议自己写，无特殊情况不必copy我的ajax写法，因为写得太烂。如需下载本地运行，请在本机装服务器环境，否则ajax会报错。）
参数列表 (options)
参数
说明
默认值
可填值
scrollArea 滑动区域 绑定元素自身 window
domUp 上方DOM {
domClass : 'dropload-up',
domRefresh : 'div class="dropload-refresh"↓下拉刷新/div',
domUpdate : 'div class="dropload-update"↑释放更新/div',
domLoad : 'div class="dropload-load"○加载中.../div'
} 数组
domDown 下方DOM {
domClass : 'dropload-down',
domRefresh : 'div class="dropload-refresh"↑上拉加载更多/div',
domLoad : 'div class="dropload-load"○加载中.../div',
domNoData : 'div class="dropload-noData"暂无数据/div'
} 数组
autoLoad 自动加载 true true和false
distance 拉动距离 50 数字
threshold 提前加载距离 加载区高度2/3 正整数
loadUpFn 上方function 空 function(me){
//你的代码
me.resetload();
}
loadDownFn 下方function 空 function(me){
//你的代码
me.resetload();
}
API
暴露一些功能，可以让dropload更灵活的使用
lock() 锁定dropload
参数
说明
lock() 智能锁定，锁定上一次加载的方向
lock('up') 锁定上方
lock('down') 锁定下方
unlock() 解锁dropload
noData() 无数据
参数
说明
noData() 无数据
noData(true) 无数据
noData(false) 有数据
resetload() 重置。每次数据加载完，必须重置
dropReload() 手动加载
已知问题
由于部分Android中UC和QQ浏览器头部有地址栏，并且一开始滑动页面隐藏地址栏时，无法触发scroll和resize，所以会导致部分情况无法使用。解决方案1：增加distance距离，例如DEMO2中distance:50；解决方案2：加meta使之全屏显示
12
meta name="full-screen" content="yes"meta name="x5-fullscreen" content="true"
阅读更多 登录后自动展开