>>分享Web前端开发技术,并对孙卫琴的《精通Vue.js:Web前端开发技术详解》提供技术支持 书籍支持  卫琴直播  品书摘要  在线测试  资源下载  联系我们
发表一个新主题 开启一个新投票 回复文章 您是本文章第 25958 个阅读者 刷新本主题
 * 贴子主题:  jQuery noConflict() 方法 回复文章 点赞(0)  收藏  
作者:sunshine    发表时间:2019-08-13 19:45:11     消息  查看  搜索  好友  邮件  复制  引用

  

jQuery -  noConflict() 方法

              如何在页面上同时使用 jQuery 和其他框架?            

jQuery 和其他 JavaScript 框架

             正如您已经了解到的,jQuery 使用 $ 符号作为 jQuery 的简写。

             如果其他 JavaScript 框架也使用 $ 符号作为简写怎么办?

            其他一些 JavaScript 框架包括:MooTools、Backbone、Sammy、Cappuccino、Knockout、JavaScript MVC、Google Web Toolkit、Google Closure、Ember、Batman 以及 Ext JS。

            其中某些框架也使用 $ 符号作为简写(就像 jQuery),如果您在用的两种不同的框架正在使用相同的简写符号,有可能导致脚本停止运行。

            jQuery 的团队考虑到了这个问题,并实现了 noConflict() 方法。                    

jQuery noConflict() 方法

             noConflict() 方法会释放对 $ 标识符的控制,这样其他脚本就可以使用它了。

            当然,您仍然可以通过全名替代简写的方式来使用 jQuery:                    

范例

$. noConflict ( ) ;
jQuery ( document ) . ready ( function ( ) {
   jQuery ( " button " ) . click ( function ( ) {
     jQuery ( " p " ) . text ( " jQuery 仍然在工作! " ) ;
   } ) ;
} ) ;

                        您也可以创建自己的简写。noConflict() 可返回对 jQuery 的引用,您可以把它存入变量,以供稍后使用。请看这个例子:                    

范例

var   jq  = $. noConflict ( ) ;
jq ( document ) . ready ( function ( ) {
   jq ( " button " ) . click ( function ( ) {
     jq ( " p " ) . text ( " jQuery 仍然在工作! " ) ;
   } ) ;
} ) ;

                       如果你的 jQuery 代码块使用 $ 简写,并且您不愿意改变这个快捷方式,那么您可以把 $ 符号作为变量传递给 ready 方法。这样就可以在函数内使用 $ 符号了 - 而在函数外,依旧不得不使用 "jQuery":                            

范例

$. noConflict ( ) ;
jQuery ( document ) . ready ( function ( $ ) {
  $ ( " button " ) . click ( function ( ) {
    $ ( " p " ) . text ( " jQuery 仍然在工作! " ) ;
   } ) ;
} ) ;

程序猿的技术大观园:www.javathinker.net



[这个贴子最后由 flybird 在 2020-02-22 13:09:19 重新编辑]
  Java面向对象编程-->面向对象开发方法概述之开发思想(上)
  JavaWeb开发-->开发JavaMail Web应用
  JSP与Hibernate开发-->映射一对多关联关系
  Java网络编程-->基于UDP的数据报和套接字
  精通Spring-->Vue CLI脚手架工具
  Vue3开发-->Vue指令
  webpack常用插件
  css3中translate、transform和translation,以及动画animati...
  JavaScript中数组的常用方法(含ES6)
  一看就懂得移动端rem布局、rem如何换算
  jQuery与AJAX的整合简介
  HTML DOM Li 对象
  JavaScript的HTML DOM Column 对象
  jQuery UI 范例:show()方法
  CSS 听觉参考手册
  响应式 Web 设计:显示图片
  CSS 网页布局
  HTML中插入脚本的用法
  HTML 头部的元素的用法
  JavaScript 代码规范
  JavaScript 正则表达式
  更多...
 IPIP: 已设置保密
楼主      
1页 0条记录 当前第1
发表一个新主题 开启一个新投票 回复文章


中文版权所有: JavaThinker技术网站 Copyright 2016-2026 沪ICP备16029593号-2
荟萃Java程序员智慧的结晶,分享交流Java前沿技术。  联系我们
如有技术文章涉及侵权,请与本站管理员联系。