如果要在页面中动态修改css全局样式,例如将页面所有字体颜色改为红色通过css可以这样实现
*{color:red;}
而如果通过js,利用页面中的按钮修改所有元素样式,即通过js点击按钮动态修改页面中所有元素样式字体颜色为红色,应如何实现
闭关修行中......
我只能想到这个方法。
Array.prototype.slice.call(document.all).forEach(function (ele) { ele.style.color = 'red'; });
用css样式相关的接口 stylesheet.insertRule或者stylesheet.addRule 这两个都可以动态插入css样式 兼容性还可以 ie9+
stylesheet.insertRule
stylesheet.addRule
比如
// https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleSheet/insertRule myStyle.insertRule("#blanc { color: white }", 0);
需要删除的时候还有deleteRule和removeRule两个方法 可以查一下相关资料
deleteRule
removeRule
[].forEach.call(document.querySelectorAll('*'),function(a){ a.style.color = 'red';})
我只能想到这个方法。
用css样式相关的接口
stylesheet.insertRule
或者stylesheet.addRule
这两个都可以动态插入css样式 兼容性还可以 ie9+比如
需要删除的时候还有
deleteRule
和removeRule
两个方法 可以查一下相关资料[].forEach.call(document.querySelectorAll('*'),function(a){
a.style.color = 'red';
})