• JQuery的noConflict()方法


    1.onConflict()方法的作用

    在页面同时使用多个js的框架。

    2.代码示例

     1 <!DOCTYPE html>
     2 <html>
     3 <head>
     4     <title>无</title>
     5     <meta charset="utf-8">
     6     <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
     7 </script>
     8 <script type="text/javascript">
     9     $.noConflict();
    10 
    11     jQuery(function(){
    12         jQuery("button").click(function(){
    13             jQuery("p").text("jQuery仍在工作!");
    14         });
    15     });
    16 </script>
    17 
    18 </head>
    19 <body>
    20 <p></p>
    21 <button>点击</button>
    22         
    23 </body>
    24 </html>

    使用变量替换

    <!DOCTYPE html>
    <html>
    <head>
        <title>无</title>
        <meta charset="utf-8">
        <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
    </script>
    <script type="text/javascript">
    // 使用变量替换
    //这里是该代码的主要内容
    var jq=$.noConflict();                       
        jq(function(){
            jq("button").click(function(){
                jq("p").text("jQuery仍在工作!");
            });
        });
    </script>
    
    </head>
    <body>
    <p></p>
    <button>点击</button>
            
    </body>
    </html>

    在函数内部继续使用$

    <!DOCTYPE html>
    <html>
    <head>
        <title>无</title>
        <meta charset="utf-8">
        <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
    </script>
    <script type="text/javascript">
    // 如果不愿意改变$,那么可以在ready方法中设置$为变量
    // jQuery(function(){})就是jQuery(document).ready(function(){})的简写
    //这里是该代码的主要内容
    $.noConflict();                       
        jQuery(function($){
            $("button").click(function(){
                $("p").text("jQuery仍在工作!");
            });
        });
    </script>
    
    </head>
    <body>
    <p></p>
    <button>点击</button>
            
    </body>
    </html>
    本博客基于网络课程完成,旨在学习,有错误请指正!
  • 相关阅读:
    C
    大数模板
    51Nod 1040 最大公约数之和
    欧拉函数
    51Nod 1384 全排列
    B
    A
    B. Mancala (Codeforces Round #478 (Div. 2))
    I
    Requests 入门
  • 原文地址:https://www.cnblogs.com/comefuture/p/6738808.html
Copyright © 2020-2023  润新知