加载jquery插件注意了
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插件注意了的更多相关文章
- seajs加载jquery插件
假设有如下一个名为get-data的jq插件: (function($) { $.fn.getData= function() { console.log($(this).attr('data')) ...
- vue动态加载jQuery插件
要先npm安装jQuery插件哦 window.$=$; window.jQuery=$; function loadJs(Url,callback){ var Nscript=document.cr ...
- angular2采用自定义指令(Directive)方式加载jquery插件
由于angular2兴起不久,相关插件还是很少,所以有时候不得不用一些jquery插件来完成项目, 那么如何把jquery插件放到angular2中呢?采用自定义指令! 在上下文之前要引入jquery ...
- 移动端下拉刷新、加载更多插件dropload.js(基于jQuery/Zepto)
移动端下拉刷新.加载更多插件dropload.js(基于jQuery/Zepto) 原文:http://www.grycheng.com/?p=1869 废话不多说,先让大家看一下案例效果: DEMO ...
- js滚动加载小插件
本文实例讲述了jquery滚动加载数据的方法.分享给大家供大家参考.具体分析如下: 少废话直接上代码!!!粗暴,直接,干脆 0//lk-2017-05-04 1(function($, win) { ...
- 【Web】移动端下拉刷新、上拉加载更多插件
移动网站中常常有的功能:列表的下拉刷新.上拉加载更多 本例介绍一种简单使用的移动端下拉刷新.上拉加载更多插件,下载及参考地址:https://github.com/ximan/dropload 插件依 ...
- 测试加载jquery
Hello world! <h1 id="main-heading">Hello world!</h1> <p><img onclick= ...
- 优化加载jQuery的方法
请看下面的一段代码: <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js" ...
- seajs加载jquery时提示$ is not a function该怎么解决
这篇文章主要介绍了seajs加载jquery时提示$ is not a function该怎么解决的相关资料,需要的朋友可以参考下 jquery1.7以上的都支持模块化加载,只是jquery默认的是支 ...
随机推荐
- A GDI+ Based Character LCD Control
This is a renew. A GDI+ Based Character LCD Control by Conmajia Character liquid crystal display (LC ...
- CF Manthan, Codefest 16 G. Yash And Trees 线段树+bitset
题目链接:http://codeforces.com/problemset/problem/633/G 大意是一棵树两种操作,第一种是某一节点子树所有值+v,第二种问子树中节点模m出现了多少种m以内的 ...
- C#邮件发送开发经本人测试通过
先准备以下工作 1.先开通邮箱我以QQ邮箱为例 2.开通 POP3/SMTP服务 (如何使用 Foxmail 等软件收发邮件?) 已开启 | 关闭 获取授权码 3.C#开发了先写一个CS文件 pub ...
- Android Gradle manifestPlaceholders 占位符详解
Android Gradle manifestPlaceholders 占位符详解 在实际项目中,AndroidManifest里十几个地方的值是需要动态的改变(生成apk文件的时候).如果每次去改也 ...
- poj3067树状数组求逆序数
Japan plans to welcome the ACM ICPC World Finals and a lot of roads must be built for the venue. Jap ...
- 2017TSC世界大脑与科技峰会,多角度深入探讨关于大脑意识
TSC·世界大脑与科技峰会是全世界范围内的集会,多角度深入探讨关于大脑意识体验来源这一根本话题,我们是谁,现实的本质是什么,我们所处宇宙空间的本质为何.该峰会由亚利桑那大学意识研究中心主办. 会议时间 ...
- 【Windows 10 应用开发】跟随系统主题颜色
有些时候,希望应用程序中的某些颜色可以与系统的主题颜色相同,并且当系统主题色改变时进行同步. 实现过程并不复杂,主要用到 UISettings 类,它公开一个 GetColorValue 方法,访问这 ...
- 我的开发环境搭建(ubuntu菜鸟)
前段时间把系统换成了ubuntu,经过一段时间到发展,终于可以比较正常到完成开发工作了,但是就在今天,我的系统崩了,进不了桌面,而且终端里边到中文也显示乱码,尝试了网上说到各种方法无效,最终我决定重装 ...
- Android分享功能实现
通过系统分享组件实现分享功能 Intent.createChooser() 方法用来弹出系统分享列表. createChooser(Intent target, CharSequence title, ...
- 【JAVAWEB学习笔记】19_事务
事务 学习目标 案例-完成转账 一.事务概述 1.什么是事务 一件事情有n个组成单元 要不这n个组成单元同时成功 要不n个单元就同时失败 就是将n个组成单元放到一个事务中 2.mysql的事务 默认的 ...