文中將講解調用 jQuery 的幾種方法,當然都是針對 WordPress 的,請自行按喜好進行選擇,WP 的 jQuery 和原版唯一的不同,就是在最后一行加了,代碼如下:
jQuery.noConflict();
這個 noConflict() 就是為了與其它的 library 兼容性,如: Prototype, MooTools,或 YUI.
第一種方法,直接在網上搜索到的 jQuery 特效,然后對其進行直接調用,代碼如下:
- <script type="text/javascript" src="<?php bloginfo('template_directory'); ?
- >/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庫:
- <script type=”text/javascript” src=”//ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js”></script>
- <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庫文件比較好些.
新聞熱點
疑難解答
圖片精選