载入jQuery库的最佳方法详细说明及实现代码
2023-06-13 09:14:43 时间
由于目前Google的不稳定,而国内没有好的同类服务,故这已不是最优方案。当然,你把Google库路径换成国内稳定且快速的路径(如果存在),依然可以受用此方法带来的各种好处。即便如此,综合考虑的话,还是Google的最合适。
网站开发的项目中使用GoogleCDN的jQuery库虽然加载速度很快,但调用本地服务器的库才可以确保万无一失。而使用Wordpress内置jQuery库的话,其末尾防止JS库冲突而加入的jQuery.noConflict()使得主题中所有jQuery代码都要做一些小修改,更可能导致一些插件效果失效。PaulIrish在HTML5Boilerplate中使用的方法我认为非常不错,分享给大家。
使用方法
使用下面的代码可以在GoogleCDN库获取失败时载入本地jQuery库:
复制代码代码如下:
网站开发的项目中使用GoogleCDN的jQuery库虽然加载速度很快,但调用本地服务器的库才可以确保万无一失。而使用Wordpress内置jQuery库的话,其末尾防止JS库冲突而加入的jQuery.noConflict()使得主题中所有jQuery代码都要做一些小修改,更可能导致一些插件效果失效。PaulIrish在HTML5Boilerplate中使用的方法我认为非常不错,分享给大家。
使用方法
使用下面的代码可以在GoogleCDN库获取失败时载入本地jQuery库:
<scripttype="text/javascript"src="//ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<scripttype="text/javascript">window.jQuery||document.write("<scripttype="text/javascript"src="/js/libs/jquery.min.js">\x3C/script>")</script>
在Wordpress主题中使用的方法为:
<scripttype="text/javascript"src="//ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<scripttype="text/javascript">window.jQuery||document.write("<scripttype="text/javascript"src="<?phpechoget_template_directory_uri();?>/jquery.min.js">\x3C/script>")</script>
注意事项
因为开头提到的原因,所以建议下载一份jQuery官方的Min库放到Wordpress当前使用的主题目录下调用,不要使用wp-includes里面的库。
GoogleCDN库的地址采用了协议相对路径,它可以很好的解决https引起的一些问题,具体可以看PaulIrish的介绍,当然你依旧可以使用带“http:”的路径。
许多网站都采用GoogleCDN提供的jQuery库,使用它可以得到出色的缓存效果。
把jQuery代码统统放到页面底部可以提高载入速度。
使用HTML5重构的页面可省略掉type=”text/javascript”。
使用SAE开发者资源
由于Google服务最近有些问题,为了稳妥,使用SAE的开发者资源是个省流量又提高速度的好方法。SAE为新浪为其应用提供的开发者资源,其中就有jQuery库。使用的话非常简单,只要到SAE开发者中心找到合适的地址并替换掉上面代码的GoogleCDN地址即可。例如:
<scripttype="text/javascript"src="//lib.sinaapp.com/js/jquery/1.5.2/jquery.min.js"></script>
<scripttype="text/javascript">window.jQuery||document.write("<scripttype="text/javascript"src="/js/libs/jquery.min.js">\x3C/script>")</script>
相关文章
- js怎么让指定方法先后顺序_jquery固定table表头
- 生成二维码的 jQuery 插件:jquery.qrcode.js
- 在jquery中怎么使用css类名和id来获取元素详解编程语言
- jQuery delay()方法的用法
- JQuery学习笔记选择器之二
- jquery将disabled的元素置为enabled的三种方法
- JQuery下的Live方法和$.browser方法使用代码
- 为jQuery增加join方法的实现代码
- Jquery插件easyUI属性汇总
- 2012年开发人员的16款新鲜的jquery插件体验分享
- JavaScript用JQuery呼叫Server端方法实现代码与参考语法
- Jquery中使用setInterval和setTimeout的方法
- jQuery学习笔记(2)--用jquery实现各种模态提示框代码及项目构架
- jQuery动画animate方法使用介绍
- jquery表单验证框架提供的身份证验证方法(示例代码)
- JS对象转换为Jquery对象实现代码
- js与jquery获取父元素,删除子元素的两种不同方法
- jquery获取颜色在ie和ff下的区别示例介绍
- IE中的File域无法清空使用jQuery重设File域
- jquery判断元素是否隐藏的多种方法
- JQuery中Ajax的Post提交在IE下中文乱码的解决方法
- jquery操作checked属性以及disabled属性的多种方法
- Jquery焦点图实例代码
- 3种Jquery限制文本框只能输入数字字母的方法
- Jquery节点遍历next与nextAll方法使用示例
- js实现jquery的offset()方法实例
- jquery隔行换色效果实现方法