更改 html 的背景属性，而不是正文

Question

如何更改 html 的背景属性？我能够更改 body 元素的背景，但我想操纵 html“标签”(?)。

操作正文背景的代码

document.body.style = 'background: radial-gradient(circle, rgba(131,170,203,1) 4%, rgba(69,113,148,1) 50%, rgba(39,71,97,1) 100%);';

这些尝试没有奏效

document.html.style = 'background: red';
document.style = 'background: red';

我想改这部分

html {
    font-family: Arial, Helvetica, sans-serif;
    color: white;
    -webkit-user-drag: none;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;

    background: radial-gradient(circle, rgba(131,170,203,1) 4%, rgba(69,113,148,1) 50%, rgba(39,71,97,1) 100%);
}

Answer 1

只需在 DOM 中放置一个背景-div 并对其进行操作。例如。位置：绝对/z-index：-1

Answer 2

通过 html 标签中的 javascript 更改背景试试这个：

document.getElementsByTagName('html')[0].style.background="radial-gradient(circle, rgba(131,170,203,1) 4%, rgba(69,113,148,1) 50%, rgba(39,71,97,1) 100%)";

Answer 3

您需要使用 document.documentElement.style 来定位 html 元素。

document.body.style = 'background: radial-gradient(circle, rgba(131,170,203,1) 4%, rgba(69,113,148,1) 50%, rgba(39,71,97,1) 100%);';

document.documentElement.style = 'background: red';

<html>
  <body>
    <p>test</p>
  </body>
</html>

更改 html 的背景属性，而不是正文

Changing the background property of the html, not the body

html

javascript

css

background

更改 html 的背景 属性，而不是正文

Changing the background property of the html, not the body

html

javascript

css

background

更改 html 的背景属性，而不是正文