程序员人生网站导航

JQUERY 1.4 你应该知道的15个新特性

栏目：jquery时间：2013-12-01 20:25:03

jQuery 1.4 最近刚刚发布. 这个版本可不是一个简单的改进,它不仅包含了很多新的特性，还改进了很多功能, 更在性能优化方面下了很大功夫, 本文将对这些新的特性和增强的部分进行讨论,希望能对你有所帮助。

推荐阅读：JQuery 1.4 API中文手册

首先现在你可以从这里下载最新的1.4的版本了：http://code.jquery.com/jquery-1.4.js

1. 传递属性给jQuery
1.4之前的版本中jQuery就通过"attr”方法支持了添加属性到元素集合中，"attr”方法不仅可以传递属性名和值，也可以传递包含有多个属性的对象集合。在1.4中，除了可以创建新的对象，现在它更能将属性对象作为参数传递给jQuery函数或对象自身。如你可以创建一个含有多个属性的链接元素，通过1.4代码如下：

jQuery('<a/>', {
id: 'gid',
href: 'http://www.google.com',
title: 'google非和谐版',
rel: 'external',
text: '进入Google!'
});

你可能会注意到"text”属性并且猜测它是干吗的，因为a标签是没有"text”属性的。呵呵，当你传递某些属性时，jquery 1.4同样会检查并使用它自己的方法。因此上面的"text”属性可以让jQuery调用它的".text()”方法并将"进入Google!“作为它的唯一参数。

这里给出一个更好的例子：

jQuery('<div/>', {
id: 'foo',
css: {
fontWeight: 700,
color: 'green'
},
click: function(){
alert('Foo被点击过!');
}
});

"id”属性是作为一个普通属性被添加的。但"css”和"click”属性则对应特定的jQuery方法。上面的代码在1.4之前一种写法如下：

jQuery('<div/>')
.attr('id', 'foo')
.css({
fontWeight: 700,
color: 'green'
})
.click(function(){
alert('Foo被点击过!');
});

更多关于jQuery特性

2. 所有的东西都可以"until“了
1.4新增了三个对DOM操作的方法，他们分别是"nextUntil", "divvUntil" 和 "parentsUntil"。这些方法会按照某个顺序去遍历DOM对象直到满足指定的筛选条件。假设我们有一个水果列表：

如果你想选择所有在"Apple”和"Strawberry”之间的元素。代码可以这样写：

jQuery('ul li:contains(苹果)').nextUntil(':contains(梨子)');
// 得到香蕉，葡萄，草莓

更多关于: prevUntil, nextUntil, parentsUntil

3. 绑定多个事件
与通过jquery链绑定多个方法到一起相比，现在你可以通过一次调用来绑定所有这些事件，如：

jQuery('#foo).bind({
click: function() {
// 具体代码
},
mouseover: function() {
// 具体代码
},
mouseout: function() {
// 具体代码
}
})

你也可以通过 ".one()"方法操作。

更多关于.bind(…)

4. Per-Property Easing
与给一个动画仅仅定义一个缓动效果相比，现在你可以给你想要添加动画效果的属性定义不同的缓动函数了。jQuery包含两个缓动函数，旋转(默认)和线性移动。如果你需要其他的效果的话，你需要去单独下载它们 !

要给每个属性指定一个缓动函数的话，你可以简单的通过属性数组来达到目的，在数组中，第一个值是你想要实现的效果值，第二个参数则是使用的缓动函数，如：

jQuery('#foo').animate({
left: 500,
top: [500, 'easeOutBounce']
}, 2000);

查看代码演示!

你也可以以键值对的形式在那些可选设置项中单独指定属性缓动函数：

jQuery('#foo').animate({
left: 500,
top: 500
}, {
duration: 2000,
specialEasing: {
top: 'easeOutBounce'
}
});

原文作者注 - 小小谦虚一下，这个新特性是作者James Padolsey的主意!

更多关于per-property easing

5. 新的Live事件!
1.4添加了对"submit”,"change”,"focus”,和"blur”事件的委托支持。在jQuery中，我们可以使用".live()”方法去委托事件。这在你需要注册事件到大量元素中或新的元素需要不断的被添加(使用".live()”会比不断的重新绑定事件更高效)将会很有用。

但是，注意！如果你需要委托"focus”和"blur”事件的时候，你必须使用"focusin”和"focusout”事件名称！

jQuery('input').live('focusin', function(){
//具体操作
});

------分隔线----------------------------

上一篇 Linux操作系统系列之硬盘结构解析

下一篇 access不能打开注册表关键字错误处理方法(80004005错误)

------分隔线----------------------------