css flex 를 하면 classList add 로 준 class 가 없어지는 이유가 무엇인가요?

Question

자바스크립트로 해당 태그를 클릭하면 target 이라는 class 를 넣어주고 target 에 대한css 가 적용이 되도록 했습니다. 근데 target class 가 flex css 때문에 target 이 없어져 css 가 적용이 안됩니다.혹시 아시는 분 계신가요?? 현 HTML 입니다.

클릭 시 메서드 입니다.async clickAddClass(target: Board_Response | null) { const rows = Array.from(document.querySelectorAll(".board-left-content-row"), for (let i = 0; i < rows.lenght; i++) { rows[i].classList.add("target"); }} 클릭 시 적용 되는 css 입니다.#board { .board-left { flex: 1.5; } .board-right { flex: 1; transition: all 0.3s; } } target에 적용 되는 css 입니다..target { color : red;}

상저씨 · Answer

for (let i &#61; 0; i < rows.lenght; i&#43;&#43;) { rows[i].classList.add(&#34;target&#34;); } 이 부분에서 rows[i] 에 DOM객체가 제대로 들어오는지 확인해보세요

어느덧아재 · Answer

스크립트로 추가한 클래스 네임은 글러벌 css가 아니면 인식을 못할 수 있습니다.적용하신 css가 scoped로 적용되어있으시다면 스크립트로 추가하신 css는 적용이 되지 않습니다.

개목거리 · Answer

상저씨for 문 안에는 잘 들어 오는데 안되네요....처음에 target 이 추가 됬다가 flex 되면서 target이 없어져요.... 어느덧아재그런가요?target자체는 들어오는데 flex 되면서 없어지니....

css flex 를 하면 classList add 로 준 class 가 없어지는 이유가 무엇인가요?

3개의 답변

Q&A 목록