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="width: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="width:100px; height:100px; background:red;display:block; visibility:hidden; position:absolute;">aaaa</div> </body> </html>