JQuery官方学习资料(译):避免与其他库的冲突
- 避免与其他库的冲突
- 设置无冲突模式
<!-- 无冲突模式 --> <script src="prototype.js"></script> <script src="jquery.js"></script> <script> var $j = jQuery.noConflict(); // $j是jQuery方法的别名;创建新的别名是可选的。 $j(document).ready(function() { $j( "div" ).hide(); }); // $的意义是document.getElementById()的快捷方式. mainDiv是一个DOM元素,而不是一个jQuery对象。 window.onload = function() { var mainDiv = $( "main" ); } </script> |
<!-- 无冲突模式的另一种设置方式 --> <script src="prototype.js"></script> <script src="jquery.js"></script> <script> jQuery.noConflict(); jQuery( document ).ready(function( $ ) { // 你可以在这里使用$作为JQuery的别名。 $( "div" ).hide(); }); // $在全局范围内是有prototype.js意义的. window.onload = function(){ var mainDiv = $( "main" ); } </script> |
考虑到用更少的代码以实现完全的兼容,这可能是最理想的解决方案。
- 引用JQuery在其他库之前
<!-- 在其他库之前加载JQuery --> <script src="jquery.js"></script> <script src="prototype.js"></script> <script> // 使用完整的JQuery名称来进行操作。 jQuery( document ).ready(function() { jQuery( "div" ).hide(); }); // 使用$作为prototype.js的定义 window.onload = function() { var mainDiv = $( "main" ); }; </script> |
- 引用JQuery函数的多种方式
- 创建一个新别名
<script src="prototype.js"></script> <script src="jquery.js"></script> <script> var $jq = jQuery.noConflict(); </script> |
- 使用立即调用的函数表达式
<!-- 在立即调用的函数中使用$ --> <script src="prototype.js"></script> <script src="jquery.js"></script> <script> jQuery.noConflict(); (function( $ ) { // 你可以在这里使用$。 })( jQuery ); </script> |
请注意,如果你使用这个技巧,你将不能够立即调用函数来使用其内部的prototype.js的方法。
- 使用参数传递给jQuery( document ).ready()函数
<script src="jquery.js"></script> <script src="prototype.js"></script> <script> jQuery(document).ready(function( $ ) { // 你可以在这里使用$。 }); </script> |
或者使用更简洁的语法:
<script src="jquery.js"></script> <script src="prototype.js"></script> <script> jQuery(function($){ // 你可以在这里使用$。 }); </script> |
JQuery官方学习资料(译):避免与其他库的冲突的更多相关文章
- JQuery官方学习资料(译):使用JQuery的.index()方法
.index()是一个JQuery对象方法,一般用于搜索JQuery对象上一个给定的元素.该方法有四种不同的函数签名,接下来将讲解这四种函数签名的具体用法. 无参数的.index() < ...
- JQuery官方学习资料(译):遍历JQuery对象和非JQuery对象
JQuery提供了一个对象遍历的Utility方法$.each()和一个JQuery集合遍历方法.each(). $.each() $.each()是一个通用的方法用来遍历对象和数组, ...
- JQuery官方学习资料(译):Utility方法
JQuery提供了一些utility方法在$命名空间里,这些方法对完成常规的编程任务非常有帮助. $.trim() 删除前后部的空白内容. // 返回 "lots of ex ...
- JQuery官方学习资料(译):Data方法
你可能经常会想需要通过元素来存储一些数据.在JavaScript中你可能需要给元素添加属性来实现这样的功能,但是在某些浏览器中,你可能还需要处理因此造成的内存泄露问题.JQuery提供了一个简 ...
- JQuery官方学习资料(译):CSS
JQuery提供了一个处理方法,可以获取或设置元素的CSS属性. // 获取 CSS 属性 $( "h1" ).css( "fontSize" ); / ...
- JQuery官方学习资料(译):遍历
一旦你通过JQuery创建了选择器,你就可以对此进行更为深入的遍历.遍历可以分为三个基本组成部分,父节点.子节点和兄弟节点.JQuery为这些部分提供了许多丰富易用的方法. <div c ...
- JQuery官方学习资料(译):JQuery对象
每当创建一个新的元素(或者选择一个已经存在的元素)时,JQuery将返回一个元素的集合.大部分的开发人员新接触JQuery的时候,都把这个集合当做数组.这个集合中的DOM元素有从零开始的索引, ...
- JQuery官方学习资料(译):操作元素
获取和设置元素的信息 有很多种方式可以改变现有的元素,最常见的是改变HTML内容或者元素的属性.JQuery提供了简单的夸浏览器的方法来帮助你实现元素信息的获取和设置. .html():获 ...
- JQuery官方学习资料(译):选择器的运作
Getters 和 Setters JQuery的方法重载,方法设置和获取值一般使用相同名称的方法,当一个方法用来设置一个值的时候称之为Setter,当一个方法用来获取一个值的时候称之为Get ...
随机推荐
- java面试问题收集(2)
1 Integer int相等问题 Integer对象和int比较的时候会有一个拆箱的过程,始终相等 Integer和new Integer对象不会相等,引用不同 两个Integer对象比较,Inte ...
- List、Set、数据结构、Collections
一.数据结构: 1.什么是数据结构: 一种数据的存储方式 2.常见的4+1种数据结构 堆栈结构: 它是只有一个开口的容器结构 特点: 先进后出(FILO) 例子:弹夹,桶装可比克 队列结构: 它是两端 ...
- 安装kylin的艰难历程
前言:暑假里老师布置的任务没有完成,来到学校后马不停蹄的安装kylin,结果一路艰难险阻,搞了快两个星期都没有弄好....现在止步于hive阶段卡死...仅将之前的步骤记录下来以便重新安装时更加顺利. ...
- PMP:11.项目采购管理
项目采购管理包括从项目团队外部采购或获取所需产品.服务或成果的各个过程. 项目采购管理包括编制和管理协议所需的管理和控制过程,例如,合同.订购单.协议备忘录 (MOA),或服务水平协议 (SLA). ...
- docker zabbix
1.zabbix-mysql 数据库 sudo docker pull zabbix/zabbix-server-mysql sudo docker run --name some-zabbix-se ...
- [转] KVM storage performance and cache settings on Red Hat Enterprise Linux 6.2
Almost one year ago, I checked how different cache settings affected KVM storage subsystem performan ...
- Python 函数中参数的分类及使用
######################非固定参数################## #第一种方式:def send_alert(msg,*users):##*users 是非固定参数,将传过来 ...
- idea导入maven项目 傻瓜都能看懂
1.找到你需要导入的项目 2.打开idea ------------------------------------------------------------------------------ ...
- python 中argparse 实例解析
一 概念: argparse是python的一个命令行解析包.它可以使写用户友好的命令行接口变得非常容易.该模块定义什么参数是需要的,并且能指出怎么解析sys.argv的参数.它也可以自动的生成帮助和 ...
- 毕业不到一年,绩效打了个D!
周末了,和大家来聊聊程序员工作态度的问题. 说说栈长的事迹吧,这是好多年前的事了,那时候,栈长才毕业不到一年,那次绩效打了个D!事后,我很气愤啊,我那时还在博客上写文章怒骂了部门经理,现在想起来,真是 ...