一、jQuery的工具方法
工具方法：不仅可以给JQ用，也可以给原生JS用
例：
$.xxx() $.yyy() $.zzz()
与上面相似的是给$带括号；这种只能给JQ对象用
$().css() $().html() $().val()
1.$.type() : 是判断类型
var a = null;
alert( typeof a ); //undefined
alert( $.type(a) ); //null
注意：type()可以判断出更多的类型（数组，json......）
2.$.trim()：去前后空格
var str = ' hello ';
alert('('+$.trim(str)+')'); //(Hello)
3.inArray() : 类似于 indexOf，查找字符所在字符串的位置
4.proxy() : 改变this指向
function show(n1,n2){
alert(n1);
alert(n2);
alert(this);
}
$.proxy(show , document);//将this指向window
proxy() 也可以传参调用
//以下两种方法均可
$.proxy(show , document,3)(4);
$.proxy(show , document,3,4);
打开页面点击则调用
$(document).click( $.proxy(show,window,3,4) );
打开页面则调用
$(document).click( $.proxy(show,window)(3,4) );
二、jQuery工具方法和Ajax
1.noConflict() : 防止冲突
因为在jquery中有很大作用，再给赋值则会报错，利用该函数可解决
//此时不光可以赋值，此时原来$具有的作用已经被miaov代替，所以可以赋值
var miaov = $.noConflict();
var $ = 10;
miaov(function(){
miaov('body').css('background','red');
});
2.parseJSON()：将字符串解析为json
var str = '{"name":"hello"}';
alert($.parseJSON( str ).name); //Hello
3.makeArray()：将类数组转化为数组
$.makeArray(aDiv).push();
比如一组div不能使用数组的push方法，当用该函数后，则可以使用
三、jQuery下使用Ajax
$.ajax({
url : 'xxx.php',
data : 'name=hello&age=20',
type : 'POST',
success : function(data){
alert(1);
},
error : function(){
alert(2);
}
});
$.get():Ajax的get提交方式
$.get('xxx.php',{ },function(){
//传输的地址；{}传输的数据 ；传输成功的回调函数
});
注意：
$().get(); //将JQ对象转化为JS对象
$.getJSON()：请求json形式
四、jQuery的插件操作
1.$.extend : 扩展工具方法下的插件形式；
例：
$.xxx()
$.yyy()
2.$.fn.extend : 扩展到JQ对象下的插件形式 ；
例：
$().xxx()
$().yyy()
我们可以写一个jq中没有的工具方法，例如，去掉左空格
$.extend({
leftTrim : function(str){
return str.replace(/^\s+/,'');
},
});
//调用这个函数即可
var str = ' hello ';
alert( '('+$.leftTrim(str)+')' );//(Hello )
再拓展一个JQ对象下的方法：拖拽
<script>
$.fn.extend({
drag : function(){
//this : $('#div1')
var disX = 0;
var disY = 0;
var This = this;
this.mousedown(function(ev){
disX = ev.pageX - $(this).offset().left;
disY = ev.pageY - $(this).offset().top;
$(document).mousemove(function(ev){
This.css('left' , ev.pageX - disX);
This.css('top' , ev.pageY - disY);
});
$(document).mouseup(function(){
$(this).off();
});
return false;
});
},
});
</script>
<script>
$(function(){
$('#div1').drag();
});
</script>
可以看一下这两个函数的区别：
<script>
$.extend({
aaa : function(){
alert(1);
},
});
$.fn.extend({
aaa : function(){
alert(2);
}
});
</script>
<script>
$.aaa(); // 1
$().aaa(); //2
</script>
