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>
复制代码

 


本文转自农夫山泉别墅博客园博客,原文链接:http://www.cnblogs.com/yaowen/p/6914896.html,如需转载请自行联系原作者

相关文章
|
6月前
|
JavaScript 前端开发
jQuery
jQuery 选择器是 jQuery 中的核心功能之一,它允许我们通过 CSS 选择器语法来选择 HTML 文档中的元素。jQuery 选择器比 CSS 选择器更加强大,因为它可以用于查找、筛选、选择和操作 HTML 元素,而且不需要了解浏览器的兼容性问题。
34 2
|
1月前
|
JavaScript 前端开发
JQuery 什么是JQuery?
JQuery 什么是JQuery?
30 0
|
6月前
|
JavaScript 前端开发 开发者
|
11月前
|
存储 JavaScript 前端开发
jQuery01
jQuery01
62 0
|
Web App开发 设计模式 JavaScript
jquery
jquery
58 0
|
JavaScript CDN
|
XML 缓存 JavaScript
jQuery(下)
jQuery(下)
|
存储 JavaScript 前端开发
三天轻松搞定JQuery
三天轻松搞定JQuery
116 0
三天轻松搞定JQuery
|
前端开发 JavaScript
|
JavaScript 前端开发
jQuery 效果
jQuery 效果
115 0