jQuery扩展与noConflict的用法-小示例
有时我们要用到自己定义的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的用法-小示例的更多相关文章
- jquery.validate.min.js 用法方法示例
页面html 代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...
- 前端（jQuery）（6）-- jQuery的扩展与noConflict
1.jQuery的扩展 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...
- jQuery之jQuery扩展和事件
一.jQuery事件 常用事件 blur([[data],fn]) 失去焦点 focus([[data],fn]) 获取焦点( 搜索框例子) change([[data],fn]) 当select下拉 ...
- web前端----jQuery扩展（很重要！！）
1.jQuery扩展语法 把扩展的内容就可以写到xxxx.js文件了,在主文件中直接导入就行了. 用法1.$.xxx() $.extend({ "GDP": function () ...
- JQuery扩展和事件
一.jQuery事件 常用事件 blur([[data],fn]) 失去焦点 focus([[data],fn]) 获取焦点( 搜索框例子) change([[data],fn]) 当select下拉 ...
- 前端之JQuery：JQuery扩展和事件
jQuery之jQuery扩展和事件 一.jQuery事件 常用事件 blur([[data],fn]) 失去焦点 focus([[data],fn]) 获取焦点( 搜索框例子) change([[d ...
- Python之Web前端jQuery扩展
Python之Web前端: 一. jQuery表单验证 二. jQuery扩展 三. 滚动菜单 一. jQuery表单验证: 任何可以交互的站点都有输入表单,只要有可能,就应该对用户输入的数据进行验证 ...
- 26、ASP.NET MVC入门到精通——后台管理区域及分离、Js压缩、css、jquery扩展
本系列目录:ASP.NET MVC4入门到精通系列目录汇总 有好一段时间没更新博文了,最近在忙两件事:1.看书,学习中...2.为公司年会节目做准备,由于许久没有练习双截棍了,难免生疏,所以现在临时抱 ...
- Jquery扩展-手把手带你体验
Jquery扩展是在项目中经常用到的,有时候为了提取一些公共方法,有时候为了模块化管理等等,下面我们来体验一下.当然扩展离不开Jquery几个基础方法 1:$.extend() 2:$.fn.func ...
随机推荐
- Java基础知识强化72：正则表达式之判断功能（手机号码判断 和 校验邮箱）
1. 判断功能: 使用了String类的matches方法,如下: public boolean matches(String regex): 2. 判断手机号码的案例: package cn.it ...
- 线段树---HDU1754 I hate it
这个题也是线段树的基础题,有了上一个题的基础,在做这个题就显得比较轻松了,大体都是一样的,那个是求和,这个改成求最大值,基本上思路差不多,下面是代码的实现 #include <cstdio> ...
- GraphViz web版
http://graphviz-dev.appspot.com/ 用来把dot语言的图画出来,很多地方用dot语言来画图,比如doxygen的类关系,gperftools的分析结果等.
- java04 Sacnner的使用
import java.util.Scanner; /** * 所有在java.lang包下面的所有类 不需要显示的引入包! * java.util.Scanner : 想获取用户的输入 必须引入相关 ...
- 腾讯云（centos7）上安装并配置PHP
1.查看yum上的php $ yum list php Loaded plugins: fastestmirror, langpacks Loading mirror speeds from cach ...
- Ecstore获取dbschema内容?
有时候在使用dbschema的时候,需要获取dbschema的结构.例如: 那么,我们可以这样写: 这样我就能获得 称呼 这个数组
- PHP XML DOM
PHP XML DOM 内建的 DOM 解析器使在 PHP 中处理 XML 文档成为可能. DOM 是什么? W3C DOM 提供了针对 HTML 和 XML 文档的标准对象集,以及用于访问和操作这些 ...
- WebBasic-表单
用来提交数据 <form></form> 属性:action:提交的url method:表单数据提交的方式 enctype:表单数据的编码方式 表单控件 --input元 ...
- iBox v2.0 发布，Web化仿iOS7界面/交互的JavaScirpt库
iBox2 是一个仿 iOS 7 界面/交互的 JavaScirpt 库,它运行在 webkit 内核的移动浏览器之上,依赖 iScroll5,帮助开发者构建更接近 iOS 体验的 WebApp. 伴 ...
- Css透明度
全透明代码:{background:transparent} 半透明代码:{filter:alpha(opacity=80);-moz-opacity:0.8;width:auto !importan ...