js dom操作点击当前显示点击其他隐藏？

Question

点击当前下checks下面的子class为none显示出来，则其他checks，class为none的隐藏，不直接用父隐藏显示的原因，父一直有显示的样式

<div class="checks">

    <div class="none"></div>

    <div class="none"></div>

    <div class="none"></div>

</div>

<div class="checks">

    <div class="none"></div>

    <div class="none"></div>

</div>

var g = document.getElementsByClassName('checks');

for(let i = 0;i<g.length;i++) {

    let none = g[i].getElementsByClassName('none');

    g[i].onclick = function (e) {

        for (let j =0;j<none.length;j++) {

            // if() {

            none[j].style.display = 'block'

            // } else {

            //   none[j].className= 'none'

            // }

        }

        e.stopPropagation();

    }

}

Answer 1

你这个思路是对的，点击当前的div，将当前div的css属性改掉。但是就着这个思路你写的代码还是有些许问题。1、获取元素放到循环外面去，不然每循环一次都要去获取一次2、里面逻辑是错的，好好理一理但是呢，还是有比较好的思路来做这个事情，那就是当你点击某个div的时候，给它加一个class，而不是修改它本身的属性