1、尽量放在</body>之前,不要放在</head>标签之前,如果执意要放也要放在css之后,例如:

<link href="style.css" .../>
<script src=jquery.js></script>

2、加载方式使用异步加载,异步加载并不是以下的这种

<script type="text/javascript" src="jquery.js"></script>

 而是这样的异步加载方式

(function(doc){
  var j =doc.createElement("script");
  j.type = "text/javascript"; j.async = true; j.src = "jquery.js";
  var s = doc.getElementsByTagName("script")[0];
  s.parentNode.insertBefore(j, s);
})(document);

3、在这里推荐一些jquer cdn加速

目前用的比较普遍的是Google提供的jquery库:

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>

当然,百度在国内的访问速度是不可小视的:

<script type="text/javascript" src="//libs.baidu.com/jquery/2.0.3/jquery.min.js"></script>

新浪的CDN同样速度飞快:

<script type="text/javascript" src="//lib.sinaapp.com/js/jquery/1.7.2/jquery.min.js"></script>

不跟风,你也可以选择微软的jquery CDN:

<script type="text/javascript" src="//ajax.aspnetcdn.com/ajax/jQuery/jquery-2.0.3.min.js"></script>

你可以直接更改上面出现的版本号来选择不同的版本。哪一个最快呢?如何选择呢?

如果你的网站访客来自海外的不少,建议选用Google,如果主要访客是国内,选择百度也没问题。但是百度在海外的访问速度可不及Google。

而且因为大多数的网站选择了Google的CDN,由于缓存原理,来访你的网站,可能google的CDN更快。

如果你不是确定自己的网站下载速度飞快,我建议最好选用上述的公开CDN来节省加载时间,同时也节省了流量。

4、如果你觉得jquery比较大的话可以使用zepto.js 其大小只有10k,最大兼容jquery API。

5、说了那么多,加载jquery的正确方式是什么?

首先选好哪个CDN,或者你自己的网站托管js文件,并确定调用的位置在头部还是body,下面以Google的jquery库为例,普通的加载方式是

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>

然而Google的服务在国内间歇性中断,所以我可以照顾一下国内访客,这么写:

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>

<script type="text/javascript">

window.jQuery || document.write(unescape('%3Cscript%20type%3D%22text/javascript%22%20src%3D%22//libs.baidu.com/jquery/2.0.3/jquery.min.js%22%3E%3C/script%3E'));

</script>

这样子即可实现如果jquery未能加载成功,则自动加载百度的jquery库,做到万无一失了。

加载jquery插件注意了的更多相关文章

  1. seajs加载jquery插件

    假设有如下一个名为get-data的jq插件: (function($) { $.fn.getData= function() { console.log($(this).attr('data')) ...

  2. vue动态加载jQuery插件

    要先npm安装jQuery插件哦 window.$=$; window.jQuery=$; function loadJs(Url,callback){ var Nscript=document.cr ...

  3. angular2采用自定义指令(Directive)方式加载jquery插件

    由于angular2兴起不久,相关插件还是很少,所以有时候不得不用一些jquery插件来完成项目, 那么如何把jquery插件放到angular2中呢?采用自定义指令! 在上下文之前要引入jquery ...

  4. 移动端下拉刷新、加载更多插件dropload.js(基于jQuery/Zepto)

    移动端下拉刷新.加载更多插件dropload.js(基于jQuery/Zepto) 原文:http://www.grycheng.com/?p=1869 废话不多说,先让大家看一下案例效果: DEMO ...

  5. js滚动加载小插件

    本文实例讲述了jquery滚动加载数据的方法.分享给大家供大家参考.具体分析如下: 少废话直接上代码!!!粗暴,直接,干脆 0//lk-2017-05-04 1(function($, win) { ...

  6. 【Web】移动端下拉刷新、上拉加载更多插件

    移动网站中常常有的功能:列表的下拉刷新.上拉加载更多 本例介绍一种简单使用的移动端下拉刷新.上拉加载更多插件,下载及参考地址:https://github.com/ximan/dropload 插件依 ...

  7. 测试加载jquery

    Hello world! <h1 id="main-heading">Hello world!</h1> <p><img onclick= ...

  8. 优化加载jQuery的方法

    请看下面的一段代码: <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js" ...

  9. seajs加载jquery时提示$ is not a function该怎么解决

    这篇文章主要介绍了seajs加载jquery时提示$ is not a function该怎么解决的相关资料,需要的朋友可以参考下 jquery1.7以上的都支持模块化加载,只是jquery默认的是支 ...

随机推荐

  1. (练习题)利用构造器函数实现三个小实例——不使用String()与Array()构造器和Math对象,不使用内建的方法的方法和属性。

    1)在String()构造器不存在的情况下自定义一个myString()构造器函数.由于String()不存在,因此您在写构造器函数时不能使用任何属于内建String对象的方法和属性.并让你所创建的对 ...

  2. codeforces 757F Team Rocket Rises Again

    链接:http://codeforces.com/problemset/problem/757/F 正解:灭绝树. mdzz倍增lca的根节点深度必须是1..我因为这个错误调了好久. 我们考虑先求最短 ...

  3. CentOS_5.6下使用cmake编译MySQL_5.5.11

    MySQL 最新的版本5.5.11需要cmake编译安装,估计以后的版本也会采用这种方式,网上找了一些安装方法有些地方是错的,自己整理一份 所以特地记录一下安装步骤及过程,以供参考!1 mysql 5 ...

  4. 基于vue2.0前端组件库element中 el-form表单 自定义验证填坑

    eleme写的基于vue2.0的前端组件库: http://element.eleme.io 我在平时使用过程中,遇到的问题. 自定义表单验证出坑: 1: validate/resetFields 未 ...

  5. 清北Day4

    版权声明:如需转载请标明出处,未得到本人许可请勿转载. 今天就可以看到传说中的 数据结构 嘿嘿嘿嘿 都有什么呢 链表 队列 栈 st表 hash 线段树 树链剖分 一.栈: 放出来这个看烂了的图 值得 ...

  6. 【lucene系列学习三】用socke把lucene做成一个web服务并实现多线程

    首先,参考http://www.cnblogs.com/itlqs/p/6104672.html和http://www.cnblogs.com/itlqs/p/6079301.html 然后,Loca ...

  7. ListView控件详解

    ListView是个较为复杂的控件   1.定义 把它拽进来,系统会自动在Designer.cs里添加一个  this.listView1 = new System.Windows.Forms.Lis ...

  8. PHP实现二维数组排序(按照数组中的某个字段)

    亲测可行

  9. IOS安装CocoaPods详情过程

    一.简介 什么是CocoaPods CocoaPods是OS X和iOS下的一个第三类库管理工具,通过CocoaPods工具我们可以为项目添加被称为“Pods”的依赖库(这些类库必须是CocoaPod ...

  10. Hibernate 核心接口和工作机制

    主要内容 Configuration类 sessionFactory接口 session接口 Transaction接口 Query 和 criteria接口 1.Configuration类 负责管 ...