本文主要介绍了JS动态修改网页body的背景色实例代码 ,需要的朋友可以参考下,希望能帮助到大家。
大部分网页默认的背景色为白色,个人感觉比较刺眼,于是写了个JS的脚本去改变body部分的背景色,代码如下:
// ==UserScript== // @name ChangeBackgroundColor // @namespace tingl // @include * // @version 1 // @grant none // ==/UserScript== (function () { 'use strict'; var color = '#ececec'; var style; function createStyle() { style = document.createElement('style'); style.type = 'text/css'; style.innerHTML = 'body {background-color: ' + color + ' !important;}'; } function changeBackgroundColor() { if(!style.parentNode) document.head.appendChild(style); } createStyle(); changeBackgroundColor(); document.head.addEventListener("DOMNodeRemoved",changeBackgroundColor); }) ()
代码比较简单,直接创建了一个body上的css样式规则,然后添加到head里,如果网页内容变化或者异步更新等使样式被移除时,通过事件监听机制重新添加到head上。
由于只是简单地改变了body上的背景色,脚本的适用范围有限。
相关推荐:
以上是JS动态修改网页body的背景色实例分享的详细内容。更多信息请关注PHP中文网其他相关文章!