android webview夜间模式javascript代码

android webview夜间模式javascript代码

本人主要总结了以下三类android webview 夜间模式javascript代码。

• 修改Background属性
• 修改Background-Color属性
• 利用invert属性翻转网页颜色

---

修改Background属性

style=document.createElement('style');
style.setAttribute('type','text/css');
styleElem=document.getElementsByTagName('head')[0].appendChild(style);
styleElem.innerHTML='';
child=document.createTextNode('body,body * {background:#2e2e2e
!important;color:RGB(200,200,200) !important;}');
styleElem.appendChild(child);

修改Background-Color属性

style=document.createElement('style');
style.setAttribute('type','text/css');
styleElem=document.getElementsByTagName('head')[0].appendChild(style);
styleElem.innerHTML='';
child=document.createTextNode('body,body * {background-color:#2e2e2e
!important;color:RGB(200,200,200) !important;}');
styleElem.appendChild(child);

利用invert属性翻转网页颜色 CSS代码：

html {
    background-color : #2e2e2e !important;
    zoom             : 1.055;
  }
body {
    text-rendering             : optimizeSpeed;
    image-rendering            : optimizeSpeed;
    -webkit-image-rendering    : optimizeSpeed;

    text-shadow            : 0 0 0 #000;
    -webkit-font-smoothing : antialiased;

    -webkit-filter         : invert(1)hue-rotate(180deg);
    -ms-filter             : invert(1)hue-rotate(180deg);
    filter                 : invert(1)hue-rotate(180deg);
}

input,textarea,select{color:purple}

img, video, iframe, canvas, svg,
embed[type='application/x-shockwave-flash'],
object[type='application/x-shockwave-flash'],
*[style*='url('] {
    -webkit-filter : invert(1)hue-rotate(180deg) !important;
    -ms-filter     : invert(1)hue-rotate(180deg) !important;
    filter         : invert(1)hue-rotate(180deg) !important;
}

---