锋利的jquery读书心得
2013-07-26 11:56
141 查看
$(document).ready(function(){
$(".has_children").click(function(){
$(this).addClass("hover")
//为当前的元素增加hover类
.children("a").show("").end()
//获取当前元素的子节点并且显示;重新定位到上次操作的元素;
.siblings().removeClass("hover")
//获取兄弟元素,并去掉他们的hover类;
.children("a").hide("");
//获取兄弟元素的子节点并且隐藏他们;
});
})
总结代码格式要领如下:
1、对于同一对象不超过3个操作的,可以直接写成一行;如下
$("li").show().unbind("click");
//取消当前元素的click事件
2、对于同一对象的较多操作,建议每行写一个操作;如下:
$(this).removeClass("mouseout")
.addClass("mouseover")
.stop()
//停止动画;
.fadeTo("fast",0.6)
fadeTo("fast",1)
unbind("click")
click(function(){
//do something……
});
3、对于多个对象的少量操作,可以每个对象写一行,如果涉及子元素,可以考虑适当地缩进。
$(this).addClass("hover")
.children("li").show().end()
.siblings().removeClass("hover")
.children("li").hide();
4、培养良好的加注释的习惯;如下
//在一个id为table的表格的tbody中,如果每行最后一列中的checkbox没有被禁用,则把这行的背景设为红色;
$("#table>tbody>tr:has(td:last:has(:checkbox:enabled))").css("background","red");
$(".has_children").click(function(){
$(this).addClass("hover")
//为当前的元素增加hover类
.children("a").show("").end()
//获取当前元素的子节点并且显示;重新定位到上次操作的元素;
.siblings().removeClass("hover")
//获取兄弟元素,并去掉他们的hover类;
.children("a").hide("");
//获取兄弟元素的子节点并且隐藏他们;
});
})
总结代码格式要领如下:
1、对于同一对象不超过3个操作的,可以直接写成一行;如下
$("li").show().unbind("click");
//取消当前元素的click事件
2、对于同一对象的较多操作,建议每行写一个操作;如下:
$(this).removeClass("mouseout")
.addClass("mouseover")
.stop()
//停止动画;
.fadeTo("fast",0.6)
fadeTo("fast",1)
unbind("click")
click(function(){
//do something……
});
3、对于多个对象的少量操作,可以每个对象写一行,如果涉及子元素,可以考虑适当地缩进。
$(this).addClass("hover")
.children("li").show().end()
.siblings().removeClass("hover")
.children("li").hide();
4、培养良好的加注释的习惯;如下
//在一个id为table的表格的tbody中,如果每行最后一列中的checkbox没有被禁用,则把这行的背景设为红色;
$("#table>tbody>tr:has(td:last:has(:checkbox:enabled))").css("background","red");
相关文章推荐
- 锋利的jQuery 要点归纳(二) jQuery中的DOM操作(下)
- C#小常识集锦(一)--《更锋利的CSharp代码》读书笔记
- 锋利的jQuery
- 锋利的JQuery学习笔记02
- Linux锋利的AWK
- 锋利的JQuery(六)
- 最锋利的Visual Studio Web开发工具扩展:Web Essentials详解
- 【锋利的JQuery-学习笔记】Tab选项卡的实现
- 【学习笔记】锋利的jQuery(一)选择器
- 锋利的BFC
- (锋利的jquer)第四章 jquery中的事件和动画
- 锋利的jquery第二版学习笔记
- 锋利的JQuery 第四章后续部分
- 【锋利的jQuery】学习笔记04
- 《锋利的jQruery》读书笔记
- JQuery-复选框的操作(摘自<锋利的JQuery>)
- 最锋利的Visual Studio Web开发工具扩展:Web Essentials使用详解
- 锋利的jquery初体验--折叠菜单练习
- 锋利的正则表达式
- 锋利的jQuery