当前位置:首页 > 编程教程 > jQuery技术文章 > 完美解决jQuery符号$与其他javascript 库、框架冲突的问题

如何处理jQuery符号$与其他javascript 库、框架冲突的问题

  • 发布时间:
  • 作者:码农之家
  • 点击:55

这篇文章主要知识点是关于jQuery、jQuery符号、javascript、javascript库、框架冲突、让jQuery与其他JavaScript库并存避免冲突的方法 的内容,如果大家想对相关知识点有系统深入的学习,可以参阅以下电子书

jQuery EasyUI开发指南
  • 类型:jQuery大小:48.4 MB格式:PDF作者:王波
立即下载

完美解决jQuery符号$与其他javascript 库、框架冲突的问题

目前有大量的 javascript 开发框架,其中有一部分使用 $ 作为调用符号,这可能导致相互之间的冲突,而 jQuery 为解决这个问题,可以在 jQuery 导入时放弃 $ 使用权,届时 $ 则由其它框架使用,这样可以避免相同名字的函数调用不再冲突。

jQuery 使用 noConflict 方法来放弃 $ 调用时的命名,之后由 jQuery 代替 $ 进行编写。

例如:alert($('#message').val());

必须修改为 alert(jQuery('#message').val());

jQuery 才能正常运行。

<script src="other_lib.js"></script>
<script src="jquery.js"></script>
<script>
 $.noConflict();
 // 之后将只能用 jQuery 进行调用
 jQuery('#message').val();
</script>

也可以重新定义 $ 进行调用

<script src="other_lib.js"></script>
<script src="jquery.js"></script>
<script>
$.noConflict();
jQuery( document ).ready(function( $ ) {
 // Code that uses jQuery's $ can follow here.
});
// Code that uses other library's $ can follow here.
</script>

换成 j 作为调用符号

var j = jQuery.noConflict();
 
// Do something with jQuery
j( "div p" ).hide();
 
// Do something with another library's $()
$( "content" ).style.display = "none";

以上这篇完美解决jQuery符号$与其他javascript 库、框架冲突的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持码农之家。

让jQuery与其他JavaScript库并存避免冲突的方法

为了解决jQuery和其他JavaScript库中$()函数的冲突,需要取消jQuery的$()函数,为此jQuery提供了如下方法:

//取消jQuery中的$()函数
jQuery.noConflict() ;

将上面的粗体字代码放在JavaScript代码的第一行,这行代码就会取消jQuery的$()函数

注:其实只是取消了jQuery()函数的$()别名,因此我们依然可以使用jQuery来代替原来的$()。

除此之外,多次重复书写jQuery()也是很烦琐的事情,jQuery还允许开发者为jQuery()指定自己的别名,如下代码所示:

<body>
<div id="lee"></div>
<script type="text/javascript" src="../jquery-1.10.2.js">
</script>
<script type="text/javascript">
//给jQuery()函数指定别名为lee
var lee = jQuery.noConflict() ;
var target = lee("#lee")
target.html("我要学习JQuery")
.height(60)
.width(160)
.css("border" , "2px solid black")
.css("background-color" , "#ddddff")
.css("padding" , 20) ;
</script>
</body>

以上就是本次给大家分享的关于java的全部知识点内容总结,大家还可以在下方相关文章里找到相关文章进一步学习,感谢大家的阅读和支持。

您可能感兴趣的文章:

  • JavaScript的jQuery库中表单转化为JSON对象的实例代码
  • jQuery中read和JavaScript中的onload函数的区别总结
  • jQuery符号$与其他javascript库、框架冲突的问题 相关电子书
    学习笔记
    网友NO.626216

    jQuery对象和Javascript对象之间转换的实例代码

    以下是本人的一些分享,我热爱编程,希望能多交编程的爱好者,如果你也是其中一名,那么请加好友,大家关注一下,下面的文章是自己觉得一些有用的东西,留下来给自己当笔记,当然也希望能帮助到你,首先感谢你的阅读~! 如果我们在用jQuery作为客户端页面的脚本,时常都会涉及到jQuery对象和Javascript对象的相互转换。因为,DOM对象就是Javascript 固有的一些对象操作。DOM 对象能使用Javascript 固有的方法,但是不能使用 jQuery 里的方法。所以,我们广州达内分享一点点它们之间的转换代码供大家学习及参考。 1. DOM 对象转成 jQuery 对象 对于已经是一个 DOM 对象,只需要用 $() 把DOM对象包装起来,就可以获得一个 jQuery 对象了,$(DOM 对象) 如: var v = document.getElementById(“v”); //DOM对象 var $v = $(v); //jQuery 对象 转换后,就可以任意使用 jQuery 的方法。 2. ……

    网友NO.581691

    JavaScript和JQuery获取DIV值的方法示例

    本文实例讲述了JavaScript和JQuery获取DIV值的方法。分享给大家供大家参考,具体如下: 1、示例代码: !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"html xmlns="http://www.w3.org/1999/xhtml"headmeta http-equiv="Content-Type" content="text/html; charset=utf-8" /titleJavaScript和JQuery获取DIV的值/titlescript type="text/javascript" src="jquery-1.7.2.min.js"/scriptscript type="text/javascript" $(function(){ $("#jqueryInput").click(function(){ var divValue = $("#div_val").text(); var divVal = $("#div_val").html(); alert("JQuery获取DIV的值:"+divValue+"\n"+divVal); }); }); function javaScriptDiv() { var divVal = document.getElementById("div_val").innerHTML; alert("JavaScript获取DIV的值:"+divVal); }/script/headbody div id="div_val"www.jb51.net/div input type="button" value="JavaScript获取DIV的值" onclick="javaScriptDiv()"/ input type="button" value="JQuery获取DIV的值" ……

    网友NO.554808

    让jQuery与其他JavaScript库并存避免冲突的方法

    为了解决jQuery和其他JavaScript库中$()函数的冲突,需要取消jQuery的$()函数,为此jQuery提供了如下方法: //取消jQuery中的$()函数 jQuery.noConflict() ; 将上面的粗体字代码放在JavaScript代码的第一行,这行代码就会取消jQuery的$()函数 注:其实只是取消了jQuery()函数的$()别名,因此我们依然可以使用jQuery来代替原来的$()。 除此之外,多次重复书写jQuery()也是很烦琐的事情,jQuery还允许开发者为jQuery()指定自己的别名,如下代码所示: body div id="lee"/div script type="text/javascript" src="../jquery-1.10.2.js" /script script type="text/javascript" //给jQuery()函数指定别名为lee var lee = jQuery.noConflict() ; var target = lee("#lee") target.html("我要学习JQuery") .height(60) .width(160) .css("border" , "2px solid black") .css("background-color" , "#ddddff") .css("padding" , 20) ; /script /body ……

    网友NO.115554

    JavaScript的jQuery库中function的存在和参数问题

    jQuery function 参数传递 jQuery的function函数中使用外部变量: //如何取得i的变量for(i=0;i3;i++) { $.get("/test.html", function(data){ alert(i) });}//使用闭包:for(i=0;i3;i++) { (function(index){ $.get("/test.html", function(data){ alert(index) }); })(i)} JavaScript、jQuery 检测某 function 是否存在 JavaScript 中检测某 function 是否存在的方法为: if(typeof $form.validate == 'function') { console.log('该 function 存在');} else { console.log('该 function 不存在');} 例如: 需要检测一个 MD5 方法是否存在: if(typeof window.md5 == 'function') { // 如果纯在该方法,才去调用 md5(286);} 而检测一个 jQuery 方法是否存在,可用一下方法: if( jQuery.isFunction(jQuery.fn.rtFunction) ) { // 如果该方法存在,才去调用 jQuery(document).rtFunction();} ……

    网友NO.818150

    在JavaScript中重写jQuery对象的方法实例教程

    jQuery是一个款非常优秀的类库,它给我们解决了很多的客户端编程,但是任何东西都不是万能的,当它不能满足我们的需求时我们就需要对它进行重写,同时也不要影响其原有的功能或者修改其原有的功能;比如我现在的web应用程序大多数时候的数据交互都是通过Ajax来完成的,这样就可以将一些隐藏字段的数据保存在HTML标签的属性中,使HTML标签的代码量减少,如:ID,Timestamp等等,这些不需要用户输入但又不得不提交的字段,通过表单提交的做法是 input name="ID" value="343" type="hidden" / 把ID的值保存在一个隐藏标签中,然后随表单提交。 代码如下所示: divlabel data-field="id" data-property="data-id" data-id="343"First Name/labelinput type="text" data-field="FirstName" //div 注意蓝色的部分这个属性名称请不要太在意,您完全可以取一些更简洁名字,现在我们来重写jQuery的val方法来……

    <
    1
    >

    Copyright 2018-2020 www.xz577.com 码农之家

    版权投诉 / 书籍推广 / 赞助:520161757@qq.com