使用 jQuery 简化 Ajax 开发:看看 Ajax 和 DOM 脚本编程究竟有多简单
2010-03-09 00:00:00 来源:WEB开发网清单 7. 轻松地遍历和处理 DOM
$('form#login')
// hide all the labels inside the form with the 'optional' class
.find('label.optional').hide().end()
// add a red border to any password fields in the form
.find('input:password').css('border', '1px solid red').end()
// add a submit handler to the form
.submit(function(){
return confirm('Are you sure you want to submit?');
});
不管您是否相信,这个示例只是一行满是空白的被链接的代码。首先,选择登录表单。然后,发现其中含有可选标签,隐藏它们,并调用 end() 返回表单。然后,我创建了密码字段,将其边界变为红色,再次调用 end() 返回表单。最后,我在表单中添加了一个提交事件处理程序。其中尤为有趣的就是(除了其简洁性以外),jQuery 完全优化了所有的查询操作,确保将所有内容很好地链接在一起后,不需要对一个元素执行两次查询。
处理常见事件就像调用函数(比方说 click()、submit() 或 mouseover())和为其传递事件处理函数一样简单。此外,还可以使用 bind('eventname', function(){}) 指定自定义的事件处理程序。可以使用 unbind('eventname') 删除某些事件或者使用 unbind() 删除所有的事件。
释放 jQuery 选择器的强大能量
我们经常会使用 ID 来选择元素,比如 #myid,或者通过类名,比如 div.myclass 来选择元素。然而,jQuery 提供了更为复杂和完整的选择器语法,允许我们在单个选择器中选择几乎所有的元素组合。
更多精彩
赞助商链接