有时我们要用到自己定义的jquery，这时可以通过jQuery扩展来实现该功能

index.html

 <!DOCTYPE html>

 <html>

 <head>

 <meta charset="UTF-8">

 <title>Insert title here</title>

    <script src="jquery-3.1.0.min.js"></script>

    <script src="myjQuery.js"></script>

    <script src="Extends.js"></script>

 </head>

 <body>

 </body>

 </html>

自己定义的 myjQuery.js

$.myjq = function(){

    alert("hello myjQuery");

}

Extends.js

$(document).ready(function(){

    $.myjq();

});

最后打开浏览器后访问，成功输出 “hello myjQuery”

接下来介绍另一种比较常用的扩展方法:

index.html

 <!DOCTYPE html>

 <html>

 <head>

 <meta charset="UTF-8">

 <title>Insert title here</title>

    <script src="jquery-3.1.0.min.js"></script>

    <script src="myjQuery.js"></script>

    <script src="Extends.js"></script>

 </head>

 <body>

      <div></div>

 </body>

 </html>

自己定义的 myjQuery.js

$.fn.myjq = function(){

    $(this).text("hello");

}

Extends.js

$(document).ready(function(){

    $("div").myjq();

});

同样实现了效果

2、jQuery当前的美元符号如果被其它框架所占有时的处理方法

index.html

 <!DOCTYPE html>

 <html>

 <head>

 <meta charset="UTF-8">

 <title>Insert title here</title>

    <script src="jquery-3.1.0.min.js"></script>

    <script src="noConflict.js"></script>

 </head>

 <body>

      <div>Hello</div>

      <button id="btn">按钮</button>

 </body>

 </html>

noConflict.js

 var myjq = $.noConflict();//当前的美元符号如果被其它框架所占有的时候,加上这句话，然后将美元符号换成myjq即可

 myjq(document).ready(function(){

     myjq("#btn").on("click",function(){

         myjq("div").text("new hello");

     });

 });

很简单...

jQuery扩展与noConflict的用法-小示例的更多相关文章

  1. jquery.validate.min.js 用法方法示例

    页面html 代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...

  2. 前端（jQuery）（6）-- jQuery的扩展与noConflict

    1.jQuery的扩展 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...

  3. jQuery之jQuery扩展和事件

    一.jQuery事件 常用事件 blur([[data],fn]) 失去焦点 focus([[data],fn]) 获取焦点( 搜索框例子) change([[data],fn]) 当select下拉 ...

  4. web前端----jQuery扩展（很重要！！）

    1.jQuery扩展语法 把扩展的内容就可以写到xxxx.js文件了,在主文件中直接导入就行了. 用法1.$.xxx() $.extend({ "GDP": function () ...

  5. JQuery扩展和事件

    一.jQuery事件 常用事件 blur([[data],fn]) 失去焦点 focus([[data],fn]) 获取焦点( 搜索框例子) change([[data],fn]) 当select下拉 ...

  6. 前端之JQuery：JQuery扩展和事件

    jQuery之jQuery扩展和事件 一.jQuery事件 常用事件 blur([[data],fn]) 失去焦点 focus([[data],fn]) 获取焦点( 搜索框例子) change([[d ...

  7. Python之Web前端jQuery扩展

    Python之Web前端: 一. jQuery表单验证 二. jQuery扩展 三. 滚动菜单 一. jQuery表单验证: 任何可以交互的站点都有输入表单,只要有可能,就应该对用户输入的数据进行验证 ...

  8. 26、ASP.NET MVC入门到精通——后台管理区域及分离、Js压缩、css、jquery扩展

    本系列目录:ASP.NET MVC4入门到精通系列目录汇总 有好一段时间没更新博文了,最近在忙两件事:1.看书,学习中...2.为公司年会节目做准备,由于许久没有练习双截棍了,难免生疏,所以现在临时抱 ...

  9. Jquery扩展-手把手带你体验

    Jquery扩展是在项目中经常用到的,有时候为了提取一些公共方法,有时候为了模块化管理等等,下面我们来体验一下.当然扩展离不开Jquery几个基础方法 1:$.extend() 2:$.fn.func ...

随机推荐

  1. 0x05: post 守护进程（deamon） json 任务调度

    python 签名 post #coding:utf-8 import urllib,urllib2 url='http://wtf.thinkphp.com/index.php?m=&c=t ...

  2. Topcoder SRM 639 (Div.2)

    A.ElectronicPetEasy [题意]一个数st1开始,每次加p1,一共加t1次,另外一个数st2开始,每次加p2,一共加t2次,输入的数均小于1000,问这两个数有没有可能相等,有可能输出 ...

  3. 【网络流#5】UVA 11082 最大流

    网络流题目最有意思的地方就是构图了,毕竟套模板每个人都会的 现在有一个矩阵,已知前i行元素之和a[i](1<=i<=n),前j列元素之和b[j](1<=j<=m),求一个可行的 ...

  4. 将用户信息保存到Cookie中

    /** * 把用户保存到Cookie * * @param request * @param response * @param member */ private void rememberPwdA ...

  5. noip 2005 等价表达式

    /* 开始想的是 维护a的每个指数的系数 然而不好办 然而还有^10^10^10这种数据 特殊值带入吧 多搞几个素数 接下来就是玄学的事了 给a赋值之后 就是简单地表达式求值 虽然思路简单 但是字符串 ...

  6. javascript：运动框架

    function startMove(obj,json,fnEnd) { clearInterval(obj.timer);//清除定时器 obj.timer=setInterval(function ...

  7. .net 中序列化和反序列化的使用

    序列化的目的:将对象状态转换为可保持或传输的格式的过程.与序列化相对的是反序列化,它将流转换为对象.这两个过程结合起来,可以轻松地存储和传输数据. 序列化 序列化分为JSON 序列化,XML序列化,二 ...

  8. charAt(i) 函数

    charAt(i) 函数 是获取字符串中i位置的字符 str.charAt(i)的意思是第i个字符在字符串str中所占的位置,输出的是数字 for (var i = 0; i < str.len ...

  9. 使用URL读取网络图片资源

    URL(Uniform Resource Locator) 对象代表统一资源定位器. 代码如下: public class MainActivity extends ActionBarActivity ...

  10. java BigDecimal的操作

    今天给大家讲一下java中BigDecimal的操作.由于double,float的精度不够,因此在进行商业计算的时候要使用的BigDecimal.BigDecimal对象创建如下: BigDecim ...