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 ...
随机推荐
- [转] DAG算法在hadoop中的应用
http://jiezhu2007.iteye.com/blog/2041422 大学里面数据结构里面有专门的一章图论,可惜当年没有认真学习,现在不得不再次捡 起来.真是少壮不努力,老大徒伤悲呀!什么 ...
- 自定义控件 TextView 歌词 Lrc
演示 <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" /> < ...
- 【Asp.Net】后台生成控件并绑定事件
在Asp.Net的Web页面处理流程中,有时候我们会碰到需要动态生成的控件,并为之绑定相应的事件. 接下来我们来动态的生成一个控件 //在用户代码初始化阶段添加控件 protected void Pa ...
- Autofac 一个使用Demo
一:接口 二:实现: 三:调用: 首先上图: 一:接口代码 public interface IPersonDa { PersonEntity Get(int id); } 二:实现 public c ...
- nginx添加缓存
nginx的具体逻辑是什么样的? 分布式session spring session redis过滤器 有4种方案: 一直访问一台 //如果这台机器垮掉了,怎么办? session同步 序列化传输 / ...
- WinAPI——模拟正弦波
/*************************** * * 程序名称 : 模拟正弦波 * 作 者 : doodle777 * 版 本 : 1.1 * 日 期 : 2012-10-19 * 说 明 ...
- php遍历数据库
数据库 <?php mysql_connect("localhost","root",""); mysql_set_charset(& ...
- kafka教程
一.理论介绍(一)相关资料1.官方资料,非常详细: http://kafka.apache.org/documentation.html#quickstart2.有一篇翻译版,基本一致,有些细节不 ...
- Eclipse关闭XML文件验证的方法,解决xml警告
XML的编写是否符合规范,可以通过XML Schema或DTD进行验证,但有时候电脑本来就很卡,而且XML的某些错误并未导致程序无法运行的情况下,暂时关闭XML的验证也算不错的选择. 如web.xml ...
- （转）Eclipse快捷键大全,导包快捷键:ctrl+Shift+/
Ctrl+1 快速修复(最经典的快捷键,就不用多说了)Ctrl+D: 删除当前行 Ctrl+Alt+↓ 复制当前行到下一行(复制增加)Ctrl+Alt+↑ 复制当前行到上一行(复制增加)Alt+↓ 当 ...