javascript - CSS 전역 스타일을 동적으로 수정하기 위해 JS를 구현하는 방법

Question

예를 들어 페이지의 CSS 전역 스타일을 동적으로 수정하려면 페이지의 모든 글꼴 색상을 빨간색으로 변경하세요.
이것은 CSS를 통해 달성할 수 있습니다

으아악

그리고 페이지의 버튼을 사용하여 js를 통해 모든 요소의 스타일을 수정한다면, 즉 js를 통해 버튼을 클릭하여 페이지의 모든 요소의 스타일을 동적으로 수정하여 글꼴 색상이 빨간색이 되도록 한다면 어떻게 해야 할까요? 구현되세요

Answer 1

이 방법 밖에 생각이 안나네요.

으아아아

Answer 2

CSS 스타일 관련 인터페이스인 stylesheet.insertRule 또는 stylesheet.addRule을 사용하세요. 둘 다 CSS 스타일을 동적으로 삽입할 수 있습니다. 호환성은 ie9+와 좋습니다. stylesheet.insertRule或者stylesheet.addRule 这两个都可以动态插入css样式 兼容性还可以 ie9+

比如

    // https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleSheet/insertRule
    myStyle.insertRule("#blanc { color: white }", 0);

需要删除的时候还有deleteRule和removeRule예를 들어

으아아아 🎜삭제해야 할 경우에는 deleteRule, removeRule 두 가지 방법이 있습니다. 관련 정보를 확인할 수 있습니다🎜

Answer 3

[].forEach.call(document.querySelectorAll('*'),function(a){
a.style.color = 'red';
})