当我们 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>
欢迎来到这里!
我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。
注册 关于