网页设置灰色与还原

1.设置网页为灰色

//创建一个元素
var globalCss = document.createElement("style");
//设置这个元素的类型 <style type = "text/css"></style>
globalCss.type = "text/css";
//获取head标签,并把<style type = "text/css"></style>添加进去
document.getElementsByTagName("head")[0].append(globalCss)
//设置style标签的样式
globalCss.appendChild(document.createTextNode("html{-webkit-filter: grayscale(100%) !important; -moz-filter: grayscale(100%) !important;-ms-filter: grayscale(100%) !important;-o-filter: grayscale(100%) !important;filter: grayscale(100%) !important;filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1) !important;}"));

2.还原网页颜色

//创建一个元素
var globalCss = document.createElement("style");
//设置这个元素的类型 <style type = "text/css"></style>
globalCss.type = "text/css";
//获取head标签,并把<style type = "text/css"></style>添加进去
document.getElementsByTagName("head")[0].append(globalCss)
//设置style标签的样式
globalCss.appendChild(document.createTextNode("html{-webkit-filter:none !important;}"));

注：做的时候可以封装成一个方法，传入对应的参数进行调用即可。