function value_check() {
        var deleteshow = document.getElementsByClassName("show").length;
        for (var j=0; j<deleteshow; j++) {
            document.getElementsByClassName("show")[j].classList.remove("show");
        }
    
        var check_count = document.getElementsByName("selector").length;
        for (var i=0; i<check_count; i++) {
            if (document.getElementsByName("selector")[i].checked == true) {
                var x = document.getElementsByName("selector")[i].id;
                var y = document.getElementsByClassName(x).length;
                for (var k=0; k<y; k++) {
                    document.getElementsByClassName(x)[k].classList.add("show");
                }

            }
        }
    }





이게 코드구여.


표의 행에 class값을 다양하게 줘서 클릭을 할 때 해당 class값에 해당하는 행을 선택해서 숨기려고 하는 코드임니다.(필터 사이트)

윗 부분은 일단 내용이 보이면 안되어서 class에서 show가 있으면 전부다 지우는 함수구여


아랫 부분은 해당되는 class 값이 있는 행의 class에 show를 넣어서, 보이게 하려고 합니다.

클래스에 show가 있으면 css에 미리 설정해둔 대로 해당 행을 보이게 할거구여.


그래서 클래스 안에 있는 show를 넣었다 뺐다 해야하는데

브라우저의 console에서는 classList.add()를 사용해서 넣었다 뺐다 할 때 코드상에서 수정이 되지 않습니다.

그 버튼을 누르면 소스부분에서 깜박깜박 거리면서 변해야되지 않슴니까?

근데 소스 내용자체에선 변하지 않고 콘솔의 classList로 조회해보면 들어갔다 뺏다 하는건 뜨는데 실질적으로 코드가 안바껴서 작동이 안됩니다.



간단히 결론만 말하면 classList.add나 classList.remove로 소스가 수정이 안된다는게 핵심입니당...


시불 좃같네요... 프로그래밍 하시는분들 존경함