Web Front End

jQuery 补漏

版本变动主要影响,从1.4.0开始,.css(), .attr(), .val(), .html(),.text(), .append(), .prepend(), .before(), .after(), .replaceWith(), .wrap(), .wrapInner(), .offset(),.addClass(), .removeClass(), .toggleClass()接受function作为参数值。 toggleClass()可以同时操作多个class。

可以使用.delay()来推迟事件队列中之后的事件。

从1.6.0开始,如果目标属性没有设置,.attr()会返回undefined。

在1.7.0中,添加了一系列callbacks方法,可以用来对callback列进行操作。比如callbacks.add()添加,callbacks.disable()禁用,callbacks.remove()删除特定的,callbacks.empty()删除所有。

在1.9.0中,.attr()可以正确的设置类似checked的值,与.prop()不同的是,它直接使用相应的值来进行设置,而.prop()使用boolean值来设置。

移除了事件中的.toggle()。移除了.live()【可以用.on()来代替】和.die()【用.off()】。.addBack()取代了.addSelf()。

属性(attributes)部分。.html()可以直接转换string值到html。包括IE9在内,之前的IE浏览器,应该使用.empty().html(),以确保不会破坏文本节点。.toggleClass()的第二参数为boolean值,当它为true,则添加class,为flase则移除class。

应该使用.prop()来获取特定属性的值,因为.prop()会返回比如checked、selected、disabled等状态的正确的值。selectedIndex, tagName, nodeName, nodeType, ownerDocument, defaultChecked, defaultSelected都应该使用.prop()来获取和设置。而元素的其它值则推荐使用.val()来设置。

jQuery.noConflict()用来解除jQuery对$的控制,使得$可以被其他库使用。

CSS部分。1.6.0之后,.css()可以使用相对值,即通过+=、-=来设定值。它不能移除由stylesheet或者元素style值确定的css。但是在IE8及其以下版本中,会移除这些值。.offset()不能获取隐藏元素的位置,同时不会将body的margin,border,padding计算在内。.outerHeight()或者.outerHeight()在参数值为true的时候,会包含元素的margin值。

.data()可以使用HTML5中的data-*属性。

jQuery.fx.off可以关闭所有动画特效。在低性能设备上使用,或者在动画出现问题的时候。.animate()的属性应该是数值,不支持简写的CSS属性,动画过程中不会使不可见元素可见。大多数特效方法都包含duration和easing这两个可选参数,duration控制快慢(执行事件,默认为400,slow为600,fast为200,单位是毫秒),easing是变换方法(默认是swing,还有linear)。1.4.0开始,可以给每个属性设置不同的easing。

DOM操作。.append()如果目标是多个元素,则会分别在目标内插入。如果插入的是本文档的元素,那么只会移动该元素到目标位置,而不是复制它(如果有多个目标,同样分别插入到每个目标内。).appendTo()等也是一样。1.4.0开始,.before()和.after()可以对自封闭节点起作用,比如<div />。.text()中的string会被转义,因而不会作为HTML元素渲染。

事件(events)部分。.dblclick()绑定双击事件。event.metaKey检测功能键是否按下。event.preventDefault()用来阻止默认动作,比如a标签的跳转。event.target事件目标,可以和this比较来检测事件是否已经执行。.on()在1.7.0开始提供了绑定事件的所有功能,是最主要的事件绑定方式。.off()用来移除绑定的事件。.one()与.on()相似,但是它只处理一个目标元素。event.which用来检测键盘及鼠标的输入,包括鼠标左(1)中(2)右键(3)。可以使用event.data来给事件添加data值。

选择器(selectors)部分。:animated用来选择当时正在执行animation的元素。属性选择器中,=选择以给定值开头,通过连字符连接的属性的元素。~=选择通过空格分隔,包含给定值的属性的元素。*=选择包含给定值的属性的元素。$=选择以给定值结尾的属性的元素。!=不包含给定值。^=以给定值开头。:eq()选择器中,索引是从0开始的,如果值为负数,那么-1代表倒数第一个。