WordPress 调用 jQuery一些方法小结

文中将讲解调用 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库文件比较好些。

时间: 2024-10-29 13:01:06

WordPress 调用 jQuery一些方法小结的相关文章

jquery 插件开发方法小结_jquery

jQuery为开发插件提拱了两个方法,分别是: jQuery.fn.extend(object); jQuery.extend(object); jQuery.extend(object); 为扩展jQuery类本身.为类添加新的方法. jQuery.fn.extend(object);给jQuery对象添加方法. fn 是什么东西呢.查看jQuery代码,就不难发现. 复制代码 代码如下: jQuery.fn = jQuery.prototype = { init: function( sel

Perl调用shell命令方法小结_基础教程

一.systemperl也可以用system调用shell的命令,它和awk的system一样,返回值也是它调用的命令的退出状态. 复制代码 代码如下: [root@AX3sp2 ~]# cat aa.pl#! /usr/bin/perl -w$file = "wt.pl";system("ls -l wt.pl");$result = system "ls -l $file";print "$result \n"; #输出命

解决同一页面中两个iframe互相调用jquery,js函数的方法_jquery

这一个月又没更新博客,唉,懒癌又犯了,今天解决了一个问题,关于两个iframe互相调用jquery函数方法 a.html中有两个iframe,如下: <iframe width="100%" height="100%" name="left" scrolling="auto" frameborder="0" src="b.html" id="left">&

jQuery.position()方法获取不到值的安全替换方法

 这篇文章主要介绍了jQuery.position()方法获取不到值的安全替换方法,本文给出了一种变通的方法,用.offset()来换算,需要的朋友可以参考下     调用jQuery.position()方法会返回相对于父元素的位置,jQuery官方文档中描述说,它跟.offset()方法不一样,.offset()返回的是相对于document的位置,而.position()返回的是相对于父元素的位置. 但事实上,在使用的过程中,我们发现.position()返回的值经常是0.但事实不是0.尤

jQuery.holdReady()方法用法实例_jquery

本文实例讲述了jQuery.holdReady()方法用法.分享给大家供大家参考.具体分析如下: 此方法可以暂停或者恢复jQuery.ready()事件.调用此方法可以延迟jQuery的ready事件,也就是说尽管文档已经加载完成,也不会执行ready事件处理方法. 可以多次调用jQuery.holdReady()方法,以延迟jQuery的ready事件,当满足一定条件时,再通过将此方法的参数设置为false,一一解除延迟.方法一般用于动态脚本加载,知道脚本加载完成然后再通过将此方法的参数设置为

jQuery.position()方法获取不到值的安全替换方法_jquery

调用jQuery.position()方法会返回相对于父元素的位置,jQuery官方文档中描述说,它跟.offset()方法不一样,.offset()返回的是相对于document的位置,而.position()返回的是相对于父元素的位置. 但事实上,在使用的过程中,我们发现.position()返回的值经常是0.但事实不是0.尤其是谷歌浏览器和IE浏览器里.火狐浏览器没有此问题. 究其原因,以基于Webkit的浏览器(谷歌浏览器和Safari浏览器)为例,只有当元素(图片.flash等)完全加

jQuery中调用WebService方法小结_jquery

个人感觉有两点是比较方便的:第一,在对WebService做ajax请求的时候,请求的url的写法是:服务地址/调用的方法名称,这样在请求的url中就确定了要调用的方法了,不必再在WebService代码中去判断ajax请求调用的是哪个方法了.第二,方法可以返回更多的数据类型,比如对象,泛型集合等:在ajax请求返回后,会自动将这些类型转换为json对象.而使用ashx的方式的话,需要先将这些类型转换为json格式的数据才能返回. 在使用jQuery调用WebService的方法的时候,只能发送

jquery.Ajax()方法调用Asp.Net后台的方法解析

 本篇文章主要是对jquery.Ajax()方法调用Asp.Net后台的方法进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助 利用JQuery的$.ajax()可以很方便的调用asp.net的后台方法. 先来个简单的实例热热身吧.   1.无参数的方法调用 asp.net code:    代码如下: using System.Web.Script.Services;      [WebMethod]    public static string SayHello()    {   

防止jQuery ajax Load使用缓存的方法小结

 本篇文章主要是对防止jQuery ajax Load使用缓存的方法进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助 一.用法  jquery的load函数是请求另一个文件并加载到当前DOM里的调用,load方法的完整格式是:load( url, [data], [callback] )(注意没有参数是GET方式请求,有参数则是 POST方法).    * url:是指要导入文件的地址.  * data:可选参数:因为Load不仅仅可以导入静态的html文件,还可以导入动态脚本,例如PH