jQuery 1.4 15个你应该知道的新特性(译)

2020-05-22 21:58:33易采站长站整理

<li>葡萄</li>
<li>草莓</li>
<li>例子</li>
<li>桃子</li>
</ul>

当一个节点被点击的时候,你如果想找到在所有的节点集合中被单击的节点的位置,你可以这样写:


jQuery(‘li’).click(function(){
alert( jQuery(this).index() );
});

 


jQuery 1.4还允许你指定一个选择器作为”.index()”的第一个参数,这样它会返回该元素在选择器中产生的元素集合中的位置。


最后需要注意的是,如果该元素在集合中存在的话,该函数会返回一个其位置的整数,如果不存在,则返回-1。


更多关于 .index(…)


12. DOM 操作的方法支持回调函数

大部分对DOM进行操作的函数现在都支持传递函数作为唯一参数了(如果是”.css()”和”.attr()”的情况的话,它会作为第二参数)。该函数会在集合中的每个元素上都执行一次,从而确定哪些应作为该函数的实际值提供给回调函数调用。


下面给出所有支持该功能的函数列表:

after
before
append
prepend
addClass
toggleClass
removeClass
wrap
wrapAll
wrapInner
val
text
replaceWith
css
attr
html

通过回调函数,你可以通过”this”访问数组中的当前元素,还可以通过第一个参数得到它在数组中的位置。


jQuery(‘li’).html(function(i){
return ‘该列表中的索引位置: ‘ + i;
});

 


同样,你也可以通过上面的某些方法得到另外一个参数,如果你调用一个setter方法(如”.html()”或”.attr(‘href’)”)你就可以直接访问当前的值了。如:


jQuery(‘a’).attr(‘href’, function(i, currentHref){
return currentHref + ‘?foo=bar’;
});

 


正如上面看到的,在使用”.css()” 和 “.attr()” 方法时,因为第一个参数需要被用作指定那些你需要设置或改变的属性名,你需要将回调函数作为第二参数。


jQuery(‘li’).css(‘color’, function(i, currentCssColor){
return i % 2 ? ‘red’ : ‘blue’;
});

 


13. 对象类型判断

jQuery 1.4添加了两个新的方法(直接放到了jQuery命名空间下面)以方便我们来判断当前处理的对象的类型。


首先是方法”isEmptyObject”,顾名思义,这个函数会返回一个布尔值来表明传递的对象是不是空对象(缺乏属性–无论是对象自身还是继续的对象)。其次是方法”isPlainObject”,它会返回一个布尔值来表明操作的对象是否是一个简单的js对象(指通过”{ }”或者”new Object”创建的对象)。