您好,欢迎访问三七文档
向下兼容的插件:jquery-migrate-1.2.1.js子元素过滤器::nth-child(index)$(.1li:nth-child(2))找到.1类下的第二个li元素(li要指明出来)与:eq(index)类似,eq从0开始,nth-child从1开始setInterval(startRequest(),1000);get():get(0)获得元旦DOM元素prop(“checked”):返回布尔值,判断checkbox是否被选中size()find():父元素中寻找子元素children()css()next()nextall()prev()prevAll()siblings():同级上下所有指定元素prevUntil():遇到指定元素停止选定nextUntil()first()last()not():not(“:checked”)eq():$(.1li).eq(2).html()同过滤器一样要加上筛选元素lihas():选择子类有指定类型的指定标签$(ul).has([title=one]);$(ul).has(.red)parent():选择包含有指定元素的元素paretnsUntil():遇到指定父节点然后停止attr()removeAttr()is()例1:$(‘.red’).is($(‘li’).get(2));判断$(‘.red’)是否$(‘li’).get(2)元素判断是否为同一元素例2:alert($(“.red”).is(function(){return$(this).attr(‘title’)==”列表3”;}));注意,必须使用$(this)来表示要判断的元素,否则,不管function里面是否反回true,false都和调用的元素无关hasClass()返回true和falseslice(start,end):选择从start到end位置的元素,如果是负数,则从后开始end():找到前一个状态(在链式方法中)例:$(li).slice(1,-1).first().end()相当于$(li).slice(1,-1)contents():获得某元素下面所有的元素节点,包括文本节点filter()灵活性高例1:$(“li”).filter(“.red,:first,:last”).css(“background”,”#ccc”);选择li的class为red的元素,加上首位li元素例2:$(“li”).filter(function(){return$(this).attr(‘class’)==’red’&&$(this).attr(‘title’)==’列表3’;}).css(“background”,”#ccc”);选择出class为red并且title属性为列表3的li元素html():例:$(‘div’).html($(‘div’).html()+”emText/em”);内容追加例:以函数形式追加$(‘div’).html(function(index,value){returnvalue+’emText/em’;});text()val():设置获取表单内容each()addClass()removeClass()toggleClass()默认样式和指定样式的切换width():已经转化为number,可以直接运算height():offset():获取某个元素相对于视口的偏移位置,返回的对象有两个属性left和topposition():获取某个元素相对于父元素的偏移位置scrollTop()获取垂直滚动条的值$(window).scrollTop(value)设置垂直滚动条的值$(window).scrollLeft()获取水平滚动条的值$(window).scrollLeft(value)设置水平滚动条的值$(window).append():向指定元素内部的后面插入appendTo():插入到指定元素内部的后面prepend():向指定元素内部的前面插入prependTo():插入到指定元素内部的前面after():在后面插入before():在前面插入insertafter():移到指定元素后面insertbefore():移到指定元素前面wrap():包裹标签例:$(“div“).wrap(“strong/strong”);unwrap():例:$(strong).unwrap($(div));不要被某个元素包裹wrapAll():所有指定元素包裹在一个指定标签里面例:$(div).wrapAll(p/p);wrapInner():包裹指定元素里面的子元素内容clone():参数true,false(深克隆,浅克隆)默认为falseremove():移除节点(不保留事件)例:$(“div”).remove(“.box”);删除.box样式的divdetach():移除节点(保留事件)empty():清空里面内容replaceWith()取代replaceAll()取代表单选择器::input使用:input可以选择全部的表单元素,而直接用input只能选择一部分:text:password:radio:checkbox:submit:reset:image:button:file:hidden表单过滤器::enable:disable:checked:selected例:$(:input[name=select]:selected).val()选择器与过滤器直接要有空格隔开,否则选择不了事件:bind()unbind()click()dblclick()mousedown()mouseup()mouseover()mouseout()mousemove()mouseenter()mouseleave()keydown()keyup()e.keyCode键码keypress()e.charCode字符编码unload()resize()$(window).resize()scroll()$(window).scroll()select()选取表单里面内容时发生change()元素内容改变时发生submit()mouseenter()enter会不触发子节点mouseover()over会触发子节点mouseout()out会触发子节点mouseleave()()leave会不触发子节点例:divstyle=width:200px;height:200px;background:green;pstyle=width:100px;height:100px;background:red;/p/div添加事件$('div').mouseover();:移入div会触发,移入p再触发:$('div').mouseenter();:穿过div或者p,在这个区域只触发一次focus()当前绑定的input元素触发(只能是input绑定该事件才有效)blur()当前绑定的input元素触发focusin()如果绑定的是input元素的父节点,也可以触发其子元素input(如div绑定该事件)focusout()如果绑定的是input元素的父节点,也可以触发其子元素inputhover(F1,F2):鼠标移入时执行F1函数,移出时执行F2函数toggle()已经废弃自己构造toggle方法:varflag=1;$(#toggle).click(function(){if(flag==1){$(this).css(background,black);flag=2;}elseif(flag==2){$(this).css(background,green);flag=3;}elseif(flag==3){$(this).css(background,blue);flag=1;}});事件对象:Function(e){returne.target;}属性typetarget是获取触发元素的DOM,触发元素,就是你点了哪个就是哪个data获取事件调用的额外数据$('input').click({user:'Lee',age:100},function(e){alert(e.data.user);//Lee});relatedTarget获取移入移出目标点离开或进入的那个DOM元素(绑定在mouseover事件)currentTarget得到的是监听元素的DOM,你绑定的哪个就是哪个pageX/pageYscreen/screenclientX/clientYtimeStampwhich获取鼠标的左中右键(1,2,3)或获取键盘按键(绑定在click事件)altKey/shiftKey/ctrlKey是否按下alt,shift,ctrl方法:同时阻止事件冒泡和默认行为$(“a”).click(function(){returnfalse;})event.stopPropagation():阻止事件冒泡event.preventDefault():阻止默认行为isDefaultPrevented()判断是否调用了preventDefault()方法isPropagationStopped()判断是否调用了stopPropagation()方法stopImmediatePropagation()取消事件冒泡,并取消该事件的后续事件处理函数isImmediatePropagationStopped()判断是否调用了stopImmediatePropagation()方法triggler():$(:button).trigger(click);例:$(:button).click(function(e,data1,data2){alert(data1+:+data2);}).trigger(click,[123,asd]);trigglerHandler()与trigger()区别:(1)..triggerHandler()方法不会触发事件的默认行为(2)triggerHandler()方法会返回当前事件执行的返回值,trigger()则返回当前包含事件触发元素的jQuery对象(3)triggerHandler()方法只会影响第一个匹配到的元素,而.trigger()会影响所有(4)triggerHandler()不会冒泡命名空间:$(:button).bind(click.aa,function(){alert(aaa);});click()事件委托:动态绑定功能(可以为新添加的元素绑定事件,bind不能实现)on():将div1子元素下button的事件都委托给父亲div1(可以动态增加button)例:$(.div1).on(click,:button,function(){$(this).clone().appendTo(.div1);})但本事div1是没有事件的,点击div1本身没有事件发生如果clone(true)的话是事件绑定不是事件委托off():移除事件委托例:$(.div1).off(click,:button);one():只触发一次事件动画效果:show():显示(有回调函数)例:$('#box').show('slow',function(){alert('动画持续完毕后,执行我!');});列队动画:$('div').first().show('fast',functionshowSpan(){显示完一个再显示另一个$(this).next().show('fast',showSpan);});hide():隐藏toggle():结合show()和hide()slideDown():向上滑动slideUp():向下滑动slideToggle():结合slideDown()和slideUp()fadeIn():淡入fadeout():淡出fadeToggle():结合fadeIn()和fadeOut()fadeT
本文标题:jQuery方法
链接地址:https://www.777doc.com/doc-2882118 .html