您的位置:首页 > Web前端 > JQuery

jquery 常用方法及事件操作 $工具方法

2016-05-20 15:53 501 查看
/**
* //dom常用操作,DOM操作
* get()	就是把JQ转成原生js
* outterWidth();
* 		类似原生offsetWidth :获取不到隐藏元素(display:none)的值
* 	text();
* 	remove();
* 	detach()跟remove一样,不过会保留删除这个元素的操作行为
* 	parents()获取当前元素的所有祖先节点
* 	closest()获取最近的指定的祖先节点包括元素自身,必须要写筛选的参数,只能找到一个元素
* 	siblings()
* 	nextAll()下面所有的兄弟节点
* 	prevAll()
* 	parentsUntil()	到什么为止
* 	nextUntil()
* 	prevUntil()
* 	clone(true) 可以接收一个参数,作用:可以复制之前的操作行为
* 	warp()	外包装
* 	warpAll()
* 	warpInner 内包装
* 	unwarp()删除包装删除父级,不包括body
* 	add()
* 	slice()	截取
* 	serialize()
* 	serializeArray()
* 	//运动
* 	animate()
* 	第三个参数:swing(默认)
* 				linear
* 	第四个参数 callback
*
* stop() 默认阻止当前运动
* stop(true) 阻止后续的运动
* stop(true,true) 可以立即停止到指定的目标点
* finish()可以立即停止到所有指定的目标点
*
* delay()
* //事件委托
* delegate  //优点:省略了循环操作,对后续添加的内容应用了事件操作
* undelegate() //阻止事件委托
*
* trigger //触发被选中元素的指定事件
* ev.data	e.target	ev.type
*/
alert($(".div").get()[0].innerHTML);

window.onload = function(){

}

$(function(){
//等DOM加载完
})
||
$(document).ready(function(){
//等DOM加载完
})

//delegate
$("li").on("click",function(){
// event
})
$("ul").delegate("li","click",function(){
// event
$("ul").undelegate(); //阻止事件委托
})

$("div").click(function(){ })
$("div").trigger('click'); //主动触发

$(".div").on("click",{name:'hello'},function(ev){
alert(ev.data.name);	//hello
alert(ev.type);		//click
alert(ev.target);	//事件源
})
<pre name="code" class="javascript">/**
* $.xx(); 工具方法不仅可以jquery用,原生JS 也可以
*
* $.type()可以返回具体类型
* $.trim()去掉空格
* $.inArray()类似于indexOf
* $.porxy()改变this指向
* $.noConflict()防止冲突
* $.parseJSON()
* $.makeArray()
*
* //插件
* $.extend 	扩展工具方法下的插件形式 $.xxx()
* $.fn.extend : 扩展到JQ对象下的插件	$().xxx()
*/

var a = "string";
alert(typeof a);
alert($.type(a));

var arr = ['a','b','c','d'];
alert($.inArray('w',arr));	//-1

function show(n1,n2){
alert(n1);
alert(n2);
alert(this);	//window
}
$.proxy(show,document)(); //document
$.proxy(show,document)(3,4);	//3,4
$.proxy(show,document,3,4)(); 	//3,4
$.proxy(show,document,3)(4); 	//3,4

$(document).click($.proxy(show,window,3,4));	//window
//noConflict
var fun  = $.noConflict();
fun(function(){

})
//ajax
$.ajax({
url : 'xx.php',
data : 'name=xxx&age=xxx',
type : 'POST',
success : function(){

},
error : function(){

}
})

// $.extend
$.extend({
leftTrim : function(){
return str.replace(/^\s+/,'');
}
})
$.leftTrim()
//$.fn.extend()
$.fn.extend(function(){
darg : function(){
var disX  = 0;
var disY  = 0;
var This = this
this.mousedown(function(ev){
var disX = ev.pageX-$(this).offset().left;
var disX = ev.pageX-$(this).offset().top;
document.mousemove(function(){
this.css('left',ev.pageX-disX);
this.css('top',ev.pageY-disY);
})
document.mouseup(function(){
$(this).off();
})
return false;
})
}
})

$("div").drag();





                                            
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: