Javascript 更改元素的背景色会将文本设置为该颜色

我正在尝试使用创建一个javascript书签。它应该添加一个元素（在本例中，它添加了一个div。div与innerHeight和innerWidth的大小一样大。高度每250毫秒收缩几个像素。它在CodePen上工作，但当我在另一个网站上尝试时，它会将页面的整个HTML更改为“白色”（这是添加元素的背景色）。以下是密码：

var falseLoaderContainer = document.getElementsByTagName("html")[0];
falseLoaderContainer.innerHTML += `<div id="falseLoader"></div>`;
var falseLoader = document.getElementById("falseLoader");
falseLoader.style.position = `absolute`;
falseLoader.style.width = `${window.innerWidth}px`;
falseLoader.style.height = `${window.innerHeight}px`;
falseLoader.style.bottom = `0px`;
falseLoader.style.left = `0px`;
falseLoader.style.backgroundColor = `white`;
var falseLoaderHeight = falseLoader.style.height.replace(/px/g, "");
var updateFalseLoader = setInterval(function () {
    falseLoaderHeight *= 1;
    falseLoaderHeight -= Math.ceil(Math.random() * 4);
    falseLoader.style.height = falseLoaderHeight + "px";
    if (falseLoaderHeight <= 0) {
        clearInterval(updateFalseLoader);
    }
}, 250);

var falseLoaderContainer=document.getElementsByTagName（“html”）[0]；
falseLoaderContainer.innerHTML+=`；
var falseLoader=document.getElementById（“falseLoader”）；
falseLoader.style.position=`absolute`；
falseLoader.style.width=`${window.innerWidth}px`；
falseLoader.style.height=`${window.innerHeight}px`；
falseLoader.style.bottom=`0px`；
falseLoader.style.left=`0px`；
falseLoader.style.backgroundColor=`white`；
var falseLoaderHeight=falseLoader.style.height.replace（/px/g，“”）；
var updateFalseLoader=setInterval（函数（）{
假装载机重量*=1；
falseLoaderHeight-=Math.ceil（Math.random（）*4）；
falseLoader.style.height=falseLoaderHeight+“px”；
如果（假装载机）重量尝试：

或：

希望这能有所帮助！
我尝试过的所有地方都很好，但是如果您愿意，您可以尝试替换css属性表单
element.style.backgroundColor='white'；
到
element.style=“background color:color；”）中的样式谢谢你，经过一点修改后我成功地使它工作了。但是作为对你第一个建议的答复，我建议你看看
var element = document.getElementById("id");
element.setAttribute("style", "background-color: COLOR;");

var element = document.getElementBYId("id");
element.style = "background-color: COLOR;");