文中将讲解调用 jQuery 的几种方法,当然都是针对 WordPress 的,请自行按喜好进行选择,WP 的 jQuery 和原版唯一的不同,就是在最后一行加了,代码如下:

jQuery.noConflict();

这个 noConflict() 就是为了与其它的 library 兼容性,如: Prototype, MooTools,或 YUI.

第一种方法,直接在网上搜索到的 jQuery 特效,然后对其进行直接调用,代码如下:

1. <script type="text/javascript" src="<?php bloginfo('template_directory'); ? 
2. >/js/jQuery.js"></script> 

2.使用 Google 的 API 库进行调用,貌似很多 jQuery 都是这样调用的,很多插件通过 Google API 替换了 WP 默认的 jQuery,利用谷歌强大的服务器来加快其调用加载速度,代码如下:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jQuery/1.2.3/jQuery.min.js">

3.直接调用 WordPress 自带的 jQuery 库:

<?php wp_enqueue_script('jQuery'); ?>

但要注意的是:此句必需加在 wp_head(); 的前面,并且在js文件中的写法是如下代码:

jQuery(document).ready(function($) { … });

这样 jQuery() 包里的所有 $() 才能被正确识别,当然也可以使用以下方法,将如下代码:

$(document).ready(function() { … });修改为：jQuery(document).ready(function($) { … });

下面就分享下wordpress如何实现加载jQuery库的最好方式,就是在知更鸟主题中的header.php文件上面添加使用下面的代码可以在Google CDN库获取失败时载入本地jQuery库:

1. <script type=”text/javascript” src=”//ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js”></script> 
2. <script type=”text/javascript”>window.jQuery || document.write(‘<script type=”text/javascript” src=”<?php echo get_template_directory_uri(); ?>/jquery.min.js”>x3C/script>’)</script> 

这样就可以实现wordpress最佳方式加载jQuery库了,万无一失,在线加载失败之后会加载本地主题中的jQuery库文件,现在Google CDN jQuery库版本似乎都不止8.2的版本了,鸟哥知更鸟主题使用的是1.5.2版本的jQuery库文件,中午下载了1.8.2版本的jQuery库文件来看下,比5.2版本的大了小,所以为了节省资源和兼容主题,还是加载主题要求的jQuery库文件比较好些.

Tags: WordPress jQuery

分享到：