AI智能
改变未来

jQuery常用API汇总

平常开发基本要用的API都在这里了  收藏回家慢慢看!

 

选择器

$(\’input:not(:checked)\’) //查找所有未选中的 input 元素

$(\”tr:gt(0)\”) //匹配所有大于给定索引值的元素

$(\”:header\”) //匹配如 h1, h2, h3之类的标题元素

$(\”:animated\”) //匹配所有正在执行动画效果的元素

$(\”:root\”) //选择该文档的根元素。

$(\”:contains(\’文本\’)\”) //匹配包含给定文本的元素

$(\”:empty\”) //匹配所有不包含子元素或者文本的空元素

$(\”:has(selector)\”) //匹配含有选择器所匹配的元素的元素

$(\”:parent\”) //匹配含有子元素或者文本的元素

$(\”:hidden\”) //匹配所有不可见元素,或者type为hidden的元素

$(\”:visible\”) //匹配所有的可见元素

 

$(\”input[name=\’newsletter\’]\”) //匹配给定的属性是某个特定值的元素

$(\”input[name!=\’newsletter\’]\”) //匹配所有不含有指定的属性,或者属性不等于特定值的元素。

$(\”input[name^=\’newsletter\’]\”) //匹配给定的属性是以某些值开始的元素

$(\”input[name$=\’newsletter\’]\”) //匹配给定的属性是以某些值结尾的元素

$(\”input[name*=\’newsletter\’]\”) //匹配给定的属性是以包含某些值的元素

 

$(\”input[id][name$=\’man\’]\”) //复合属性选择器,需要同时满足多个条件时使用—>找到所有含有 id 属性,

                                             并且它的 name 属性是以 man 结尾的

 

! $(\”:first-child\”) //匹配所给选择器( :之前的选择器)的第一个子元素

                        //类似的:first匹配第一个元素,但是:first-child选择器可以匹配多个:即为每个父级元素匹配第一个子

                          元素。这相当于:nth-child(1)

! $(\”span:first-of-type\”) //查找作为父元素的span类型子元素中的\”长子\”的span标签—>即查找span的大儿子

$(\”last-child\”) //匹配最后一个子元素. :last 只匹配最后一个元素,而此选择符将为每个父元素匹配最后一个子元素

$(\”:last-of-type\”) //结构化伪类,匹配E的父元素的最后一个E类型的孩子

$(\”:nth-child(index)\”) //匹配其父元素下的第N个子或奇偶元素 index从1开始算

$(\”:nth-last-child(index)\”) //选择所有他们父元素的第n个子元素。计数从最后一个元素开始到第一个。

! $(\”:nth-of-type\”) //选择同属于一个父元素之下,并且标签名相同的子元素中的第n个。

$(\”:only-child\”) //如果某个元素是父元素中唯一的子元素,那将会被匹配

$(\”:input\”) //匹配所有 input, textarea, select 和 button 元素

$(\”:text\”) //匹配所有的单行文本框—>即type=\”text\”的元素

 

 

属性

$().attr() //设置或返回被选元素的属性值。

$().removeAttr() //从每一个匹配的元素中删除一个属性

$().prop() //获取在匹配的元素集中的第一个元素的属性值。

$().removeProp() //用来删除由.prop()方法设置的属性集

$().addClass() //为每个匹配的元素添加指定的类名。

$().removeClass() //从所有匹配的元素中删除全部或者指定的类。

$().toggleClass() //如果存在(不存在)就删除(添加)一个类。

$().html() //取得第一个匹配元素的html内容。这个函数不能用于XML文档。但可以用于XHTML文档。

$().text() //取得所有匹配元素的内容。

$().val() //获得匹配元素的当前值。

 

CSS

$().css() //访问匹配元素的样式属性。

$().offset() //获取匹配元素在当前视口的相对偏移。 返回的对象包含两个整型属性:top 和 left,以像素计。

此方法只对可见元素有效。

$().position() //获取匹配元素相对父元素的偏移。

//返回的对象包含两个整型属性:top 和 left。为精确计算结果,请在补白、边框和填充属性上使用像素单位。

此方法只对可见元素有效。

$().scrollTop() //获取匹配元素相对滚动条顶部的偏移。 此方法对可见和隐藏元素均有效。

$().scrollLeft() //获取匹配元素相对滚动条左侧的偏移。 此方法对可见和隐藏元素均有效。

$().height() //取得匹配元素当前计算的高度值(px)。

$().width() //取得第一个匹配元素当前计算的宽度值(px)。

$().innerHeight() //获取第一个匹配元素内部区域高度(包括补白、不包括边框)。 此方法对可见和隐藏元素均有效。

$().innerWidth() //获取第一个匹配元素内部区域宽度(包括补白、不包括边框)。 此方法对可见和隐藏元素均有效。

$().outerHeight() //获取第一个匹配元素外部高度(默认包括补白和边框)。 此方法对可见和隐藏元素均有效。

$().outerWidth() //获取第一个匹配元素外部宽度(默认包括补白和边框)。 此方法对可见和隐藏元素均有效。

 

 

 

文档处理

$(\”p\”).append(\”<h1></h1>\”) //向每个匹配的元素内部追加内容。 —>将h1追加到p中

$(\”p\”).appendTo(\”<h1></h1>\”) //把所有匹配的元素追加到另一个指定的元素元素集合中。 –>将p追加到h1中

$().prepend() //向每个匹配的元素内部前置内容。

$().prepengTo() //把所有匹配的元素前置到另一个、指定的元素元素集合中。

$(A).after(B) //在每个匹配的元素之后插入内容。 –>在A的后面插入B

$().before() //在每个匹配的元素之前插入内容。

                               //append,prepend是在结尾标签前插入(内部);after,before是在标签后面插入(外部)

$(A).insertAfter(B) //把所有匹配的元素插入到另一个、指定的元素元素集合的后面。 –>把A插入到B的后面

$().insertBefore() //把所有匹配的元素插入到另一个、指定的元素元素集合的前面。

$().wrap() //把所有匹配的元素用其他元素的结构化标记包裹起来。

$(\”p\”).wrap(\”<div class=\’wrap\’></div>\”); //把所有的段落用一个新创建的div包裹起来

$().unwrap() //这个方法将移出元素的父元素

$().wrapAll() //将所有匹配的元素用单个元素包裹起来

$(\”p\”).wrapAll(\”<div></div>\”); //用一个生成的div将所有段落包裹起来

$().wrapInner() //将每一个匹配的元素的子内容(包括文本节点)用一个HTML结构包裹起来

$(C).replaceWith(A) //将所有匹配的元素替换成指定的HTML或DOM元素。

                   –>用A来替换B;是以移动的方式来替换的,

                       不是以复制的方式来替换。

                         //A

                         //B ==> B

                         //C A

$(A).replaceAll(B) //用匹配的元素替换掉所有 selector匹配到的元素。 用A来替换掉B

$().empty() //删除匹配的元素集合中所有的子节点。

$(\”p\”).remove() //从DOM中删除所有匹配的元素。 –>把带<p></p>标签的都删了

                        //这个方法不会把匹配的元素从jQuery对象中删除,因而可以在将来再使用这些匹配的元素。但除了这个

                          元素本身得以保留之外,其他的比如绑定的事件,附加的数据等都会被移除

$().detach() //从DOM中删除所有匹配的元素。

                       //这个方法不会把匹配的元素从jQuery对象中删除,因而可以在将来再使用这些匹配的元素。

                       与remove()不同的是,所有绑定的事件、附加的数据等都会保留下来。

$().clone() //克隆匹配的DOM元素并且选中这些克隆的副本。

 

 

 

 

筛选

         $().eq()    //获取当前链式操作中第N个jQuery对象,返回jQuery对象

        $().first()   //获取第一个元素

        $().last()    //获取最后一个元素

        $().hasClass()   //检查当前的元素是否含有某个特定的类,如果有,则返回true。

        $().filter()     //筛选出与指定表达式匹配的元素集合。

        $().is()    //根据选择器、DOM元素或 jQuery 对象来检测匹配元素集合,如果其中至少有一个元素符合这个给定的表达式就返回true。

        $().map()   //将一组元素转换成其他数组(不论是否是元素数组)

        $().has()    //保留包含特定后代的元素,去掉那些不含有指定后代的元素。

        $().not()    //从匹配元素的集合中删除与指定表达式匹配的元素

        $().slice(start,end)  //选取一个匹配的子集  与原来的slice方法类似

        $().children()    //取得一个包含匹配的元素集合中每一个元素的所有子元素的元素集合。

        $().closest()    //从元素本身开始,逐级向上级元素匹配,并返回最先匹配的元素

        $().find()     //从元素本身开始,逐级向上级元素匹配,并返回最先匹配的元素

        $().next()      //取得一个包含匹配的元素集合中每一个元素紧邻的后面同辈元素的元素集合。

        $().nextAll()   //查找当前元素之后所有的同辈元素。

        $().nextUntil()    //查找当前元素之后所有的同辈元素,直到遇到匹配的那个元素为止

        $().offsetParent()    //返回第一个匹配元素用于定位的父节点

                             //这返回父元素中第一个其position设为relative或者absolute的元素。此方法仅对可见元素有效。

        $().parent()   //取得一个包含着所有匹配元素的唯一父元素的元素集合     老爸

        $().parents()    //取得一个包含着所有匹配元素的祖先元素的元素集合(不包含根元素)   祖宗

        $().parentsUntil()   //查找当前元素的所有的父辈元素,直到遇到匹配的那个元素为止

        $().prev()   //取得一个包含匹配的元素集合中每一个元素紧邻的前一个同辈元素的元素集合。

        $().prevAll()    //查找当前元素之前所有的同辈元素

        $().prevUntil()    //查找当前元素之前所有的同辈元素,直到遇到匹配的那个元素为止

        $().siblings()    //取得一个包含匹配的元素集合中每一个元素的所有唯一同辈元素的元素集合

 

 

事件

        $().ready()   

        $().on()   //在选择元素上绑定一个或多个事件的事件处理函数

        $().off()    //在选择元素上移除一个或多个事件的事件处理函数

        $().one()    //为每一个匹配元素的特定事件(像click)绑定一个一次性的事件处理函数

        $().trigger()    //在每一个匹配的元素上触发某类事件

        $().hover()   //个模仿悬停事件(鼠标移动到一个对象上面及移出这个对象)的方法

        $().toggle()    //用于绑定两个或多个事件处理器函数,以响应被选元素的轮流的 click 事件

        $().focus()   //当元素获得焦点时,触发 focus 事件

        $().blur()   //当元素失去焦点时触发 blur 事件

        $().change()   //当元素的值发生改变时,会发生 change 事件

        $().click()   //触发每一个匹配元素的click事件

        $().dblclick()   //当双击元素时,会发生 dblclick 事件

        $().keydown()  //当键盘或按钮被按下时,发生 keydown 事件

        $().keypress()   //当键盘或按钮被按下时,发生 keypress 事件

        $().keyup()   //当按钮被松开时,发生 keyup 事件。它发生在当前获得焦点的元素上

        $().mousedown()   //当鼠标指针移动到元素上方,并按下鼠标按键时,会发生 mousedown 事件

        $().mouseenter()   //当鼠标指针穿过元素时,会发生 mouseenter 事件。该事件大多数时候会与mouseleave 事件一起使用

        $().mouseleave()   //当鼠标指针离开元素时,会发生 mouseleave 事件。该事件大多数时候会与mouseenter 事件一起使用

        $().mousemove()    //当鼠标指针在指定的元素中移动时,就会发生 mousemove 事件

        $().mouseout()   //当鼠标指针从元素上移开时,发生 mouseout 事件

        $().mouseover()   //当鼠标指针位于元素上方时,会发生 mouseover 事件

        $().mouseup()   //当在元素上放松鼠标按钮时,会发生 mouseup 事件

        $().resize()    //当调整浏览器窗口的大小时,发生 resize 事件

        $().scroll()    //当用户滚动指定的元素时,会发生 scroll 事件

        $().select()    //当 textarea 或文本类型的 input 元素中的文本被选择时,会发生 select 事件

        $().submit()   //当提交表单时,会发生 submit 事件

        $().unload()   //在当用户离开页面时,会发生 unload 事件

                         //具体来说,当发生以下情况时,会发出 unload 事件:

                             //点击某个离开页面的链接

                             //在地址栏中键入了新的 URL

                             //使用前进或后退按钮

                             //关闭浏览器

                             //重新加载页面

        $().show()    //显示隐藏的匹配元素

        $().hide()    //隐藏显示的元素

        $().toggle()   //用于绑定两个或多个事件处理器函数,以响应被选元素的轮流的 click 事件

        $().slideDown()   //通过高度变化(向下增大)来动态地显示所有匹配的元素,在显示完成后可选地触发一个回调函数

        $().slideUp()    //通过高度变化(向上减小)来动态地隐藏所有匹配的元素,在隐藏完成后可选地触发一个回调函数

        $().slideToggle()   //通过高度变化来切换所有匹配元素的可见性,并在切换完成后可选地触发一个回调函数

        $().fadeIn()    //通过不透明度的变化来实现所有匹配元素的淡入效果,并在动画完成后可选地触发一个回调函数

        $().fadeOut()    //通过不透明度的变化来实现所有匹配元素的淡出效果,并在动画完成后可选地触发一个回调函数

        $().fadeTo()   //把所有匹配元素的不透明度以渐进方式调整到指定的不透明度,并在动画完成后可选地触发一个回调函数

        $().fadeToggle()   //通过不透明度的变化来开关所有匹配元素的淡入和淡出效果,并在动画完成后可选地触发一个回调函数

        $().animate()   //用于创建自定义动画的函数。

        $().stop()    //停止所有在指定元素上正在运行的动画

        $().delay()    //设置一个延时来推迟执行队列中之后的项目

        $().finish()    //停止当前正在运行的动画,删除所有排队的动画,并完成匹配元素所有的动画

 

 

 

事件对象

event.currentTarget    //在事件冒泡阶段中的当前DOM元素

        event.data    //当前执行的处理器被绑定的时候,包含可选的数据传递给jQuery.fn.bind

        event.preventDefault()    //阻止默认事件行为的触发

        event.stopPropagation()   //防止事件冒泡到DOM树上,也就是不触发的任何前辈元素上的事件处理函数

        event.target()    //最初触发事件的DOM元素

 

赞(0) 打赏
未经允许不得转载:爱站程序员基地 » jQuery常用API汇总