对li标签的相关操作——点击li标签进行样式切换的两种方式
Demo演示:
- 1
- 2
- 3
- 4
详解:
第一种方式(以ul为基础):
$("ul").bind("click", function(e) { $(e.target).closest("li").addClass("hilight"); $(e.target).closest("li").siblings().removeClass("hilight"); });
注解:closest() 方法获得匹配选择器的第一个祖先元素,从当前元素开始沿 DOM 树向上
toggleClass():该方法检查每个元素中指定的类。如果不存在则添加类,如果已设置则删除之。
addClass():添加类;removeClass():移除类
第二种方式(以li为基础):
$("ul>li").click(function(){ $(this).addClass("hilight"); $(this).siblings().removeClass("hilight"); })