当我们 DOM 有很多节点的时候,列入下面这个结构
<html>
<body>
<div class="container">
<div class="a1">
<div class="a2">
<div class="a3" onclick="handleClick(this)">
.....
</div>
</div>
</div>
</div>
<div class="container">
<div class="b1">
<div class="b2">
<div class="b3" onclick="handleClick(this)">
.....
</div>
</div>
</div>
</div>
</body>
</html>
我为 类名为"a3" 的元素添加了一个点击事件即 onclick 想要做到一点击就将改变该元素父节点类名为"container"(不止一个)的背景颜色改为黑色
这时候我们就应该使用递归方法了
<script>
var handleClick = function(elem) {
//当传入元素类名不等于container的时候
if($(elem)[0].className != "container") {
//将该元素的所有父节点传入此方法
handleClick($(elem).parent())
}else {
//如果元素类名等于"container"改变背景颜色
$(elem).css({
'background-color': '#000000'
})
}
}
</script>
欢迎来到这里!
我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。
注册 关于