zoukankan      html  css  js  c++  java
  • jquery08

    <!DOCTYPE HTML>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>无标题文档</title>
    <script src="jquery-2.0.3.js"></script>
    <script>
    ----------------------------------------------------------------------
    var str = '  hello  ';
    alert( '('+$.trim(str)+')' );//前后空格,不包括里面空格,
    alert( '('+str.trim()+')' );
    ----------------------------------------------------------------------
    window.onload = function(){
        
        var aDiv = document.getElementsByTagName('div');
        console.log( $.makeArray( aDiv ) );//[div,div,div]
        
        var s = 123;
        console.log( $.makeArray( s ) );//[123]
        console.log( $.makeArray( s , {length:3} ) );//Object {3: 123, length: 4}
        
        var str = 'hello';
        console.log( $.makeArray( str ) );//['hello']
        console.log( $.makeArray( str , {length:3} ) );//Object {3: "hello", length: 4}
        
        var str = {1:1,2:2};
        console.log( $.makeArray( str ) );//[{1:1,2:2}]
        console.log( $.makeArray( str , {length:3} ) );//{3:{1:1,2:2},length: 4}
    };
    ---------------------------------------------------------------------------
    var arr = ['a','b','c','d'];
    alert( $.inArray( 'w' , arr ) );  indexOf
    
    ---------------------------------------------------------------------------
    console.log($.merge(['a','b'],['c','d']));//["a", "b", "c", "d"]
    console.log($.merge(['a','b'],{0:'c',1:'d'}));//["a", "b", "c", "d"]
    console.log( $.merge({0:'a',1:'b',length:2},{0:'c',1:'d'}) );//{0: "a", 1: "b", 2: "c", 3: "d", length: 4}
    console.log( $.merge({0:'a',1:'b',length:2},['c','d']) );// {0: "a", 1: "b", 2: "c", 3: "d", length: 4}
    </script>
    </head>
    
    <body>
    <div></div>
    <div></div>
    <div></div>
    </body>
    </html>
    <!DOCTYPE HTML>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>无标题文档</title>
    <script src="jquery-2.0.3.js"></script>
    <script>
    ------------------------------------------------------------------------
    var arr = [1,2,3,4];
    arr = $.grep( arr , function( n , i ){//n是每一项,i是下标
        return n>2;
    } , true );
    console.log( arr );//[1,2]
    
    var arr = [1,2,3,4];
    arr = $.grep( arr , function( n , i ){//n是每一项,i是下标
        return n>2;
    });
    console.log( arr );//[3,4]
    ------------------------------------------------------------------------
    var arr = [1,2,3,4];
    arr = $.map( arr , function(n){
        return [n+1];
    } );
    console.log( arr );//[2,3,4,5]
    ------------------------------------------------------------------------
    </script>
    </head>
    
    <body>
    </body>
    </html>
    <!DOCTYPE HTML>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>无标题文档</title>
    <script src="jquery-2.0.3.js"></script>
    <script>
    $(function(){
        function show(){
            alert(this);
        }
        $('input:eq(0)').click(  show  );
        $('input:eq(1)').click(function(){
            $('input:eq(0)').off();//取消第一个的绑定
        });
    });
    
    $(function(){
        function show(){
            alert(this);
        }
        $('input:eq(0)').click(  $.proxy(show,window)  );//改变show的this是window,
        $('input:eq(1)').click(function(){
            $('input:eq(0)').off();//取消第一个的绑定
        });
    });
    
    --------------------------------------------------------------------------
    
    function show(n1,n2){
        alert(n1);
        alert(n2);
        alert(this);
    }
    show();//window
    $.proxy(show,document)(3,4);//改变show的this是document,执行,$.proxy()返回值是一个函数名函数地址,加小括号返回的函数才执行,
    $.proxy(show,document,3)(4);//改变show的this是document,执行,
    $.proxy(show,document,3);//不执行,返回函数地址,
    
    
    var obj = {
        show : function(){
            alert(this);
        }
    };
    $(document).click( obj.show );//this是document
    $(document).click( $.proxy(show,obj) );//this是obj
    
    $(document).click( $.proxy(obj,'show') );//让obj下面的show指向obj
    //$.proxy(obj,'show') ->  $.proxy(obj.show,obj)
    
    </script>
    </head>
    
    <body>
    <input type="button" value="点击">
    <input type="button" value="取消绑定">
    </body>
    </html>
    <!DOCTYPE HTML>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>无标题文档</title>
    <script src="jquery-2.0.3.js"></script>
    <script>
    
    $().css();  $().attr();  set/get
    
    $(function(){
        alert( $('#div1').css('width') );
        $('#div1').css('background','yellow');
        $('#div1').css('background','yellow');
        $('#div1').css('width','300px');
        $('#div1').css({ background : 'yellow' , width : '300px' });
        alert( $.now() );//1970年的时间
        (new Date()).getTime()
    });
    
    </script>
    </head>
    
    <body>
    <div id="div1" style="100px; height:100px; background:red">aaaa</div>
    </body>
    </html>
    <!DOCTYPE HTML>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>无标题文档</title>
    <script src="jquery-2.0.3.js"></script>
    <script>
    
    $(function(){
    alert( $('#div1').width() );//display:none还是获取到了,利用的是swap方法
    alert( $('#div1').get(0).offsetWidth );//原生的宽度方法,display:none就获取不到了
    
    
        function show(){    
            arguments.length    
        }
        show(1,2,3,4);
    });
    
    </script>
    </head>
    
    <body>
    <div id="div1" style="100px; height:100px; background:red;display:block; visibility:hidden; position:absolute;">aaaa</div>
    </body>
    </html>
  • 相关阅读:
    PHP基本的语法以及和Java的差别
    Linux 性能測试工具
    【Oracle 集群】Linux下Oracle RAC集群搭建之Oracle DataBase安装(八)
    【Oracle 集群】Oracle 11G RAC教程之集群安装(七)
    【Oracle 集群】11G RAC 知识图文详细教程之RAC在LINUX上使用NFS安装前准备(六)
    【Oracle 集群】ORACLE DATABASE 11G RAC 知识图文详细教程之RAC 特殊问题和实战经验(五)
    【Oracle 集群】ORACLE DATABASE 11G RAC 知识图文详细教程之缓存融合技术和主要后台进程(四)
    【Oracle 集群】ORACLE DATABASE 11G RAC 知识图文详细教程之RAC 工作原理和相关组件(三)
    Oracle 集群】ORACLE DATABASE 11G RAC 知识图文详细教程之ORACLE集群概念和原理(二)
    【Oracle 集群】ORACLE DATABASE 11G RAC 知识图文详细教程之集群概念介绍(一)
  • 原文地址:https://www.cnblogs.com/yaowen/p/6914896.html
Copyright © 2011-2022 走看看