jQuery最新1.4 版本的十五个新特性
文章出处:http://www.weboffer.cn/index.php/html/628.html
1. 传参给jQuery(…)
之前,jQuery可以通过attr 方法设置元素的属性,既可传属性的名和值,也可以是包含几组特定 属性名值对 的 对象。在jQuery 1.4 中,你可以把一个参数对象作为第二个参数传给jQuery 函数本身,同时创建HTML元素。
比方说你想要创建一个带有几个属性的锚记元素(<a></a>)。在1.4中,一切如此简单:
Js代码
jQuery(‘<a/>’, {
id: ‘foo’,
href: ‘http://google.com’,
title: ‘Become a Googler’,
rel: ‘external’,
text: ‘Go to Google!’
});
jQuery(‘<a/>’, {
id: ‘foo’,
href: ‘http://google.com’,
title: ‘Become a Googler’,
rel: ‘external’,
text: ‘Go to Google!’
});你大概也能猜到,这个锚记元素没有的text 属性会调用jQuery 的私有方法.text() ,把元素里的文字设置为“Go to Google!”
针对这一用法,下面是更有用的实例:
Js代码
jQuery(‘<div/>’, {
id: ‘foo’,
css: {
fontWeight: 700,
color: ‘green’
},
click: function(){
alert(‘Foo has been clicked!’);
}
});
jQuery(‘<div/>’, {
id: ‘foo’,
css: {
fontWeight: 700,
color: ‘green’
},
click: function(){
alert(‘Foo has been clicked!’);
}
});id 为一般属性,被直接加上了,而css 和click 则激发了相应的jQuery 方法。在1.4以前,上面的代码需写成这个样子:
Js代码
jQuery(‘<div/>’)
.attr(‘id’, ‘foo’)
.css({
fontWeight: 700,
color: ‘green’
})
.click(function(){
alert(‘Foo has been clicked!’);
});
jQuery(‘<div/>’)
.attr(‘id’, ‘foo’)
.css({
fontWeight: 700,
color: ‘green’
})
.click(function(){
alert(‘Foo has been clicked!’);
});2. 直到遇见你…
1.4的DOM遍历工具包里又增加了3个新方法:nextUntil,prevUntil 和 parentsUntil 。这些方法会按照特定的方向遍历DOM,直到遇到满足指定选择符的元素为止。举例来说,现在我们有一张水果名的清单:
Html代码
<ul>
<li>Apple</li>
<li>Banana</li>
<li>Grape</li>
<li>Strawberry</li>
<li>Pear</li>
<li>Peach</li>
</ul>
<ul>
<li>Apple</li>
<li>Banana</li>
<li>Grape</li>
<li>Strawberry</li>
<li>Pear</li>
<li>Peach</li>
</ul>
我们想挑选出所有在Apple 后,Pear 前的所有条目。代码十分简单:
Js代码
jQuery(‘ul li:contains(Apple)’).nextUntil(‘:contains(Pear)’);
jQuery(‘ul li:contains(Apple)’).nextUntil(‘:contains(Pear)’);3. 绑定多个事件处理器
相关新闻>>
- 发表评论
-
- 最新评论 更多>>