Как изменить цвет фона с помощью JavaScript? - PullRequest
124 голосов
/ 13 октября 2008

Кто-нибудь знает простой способ поменять цвет фона веб-страницы с помощью JavaScript?

Ответы [ 17 ]

1 голос
/ 01 февраля 2011

Добавьте этот элемент сценария к элементу тела, изменив цвет по желанию:

<body>
  <p>Hello, World!</p>
  <script type="text/javascript">
     document.body.style.backgroundColor = "#ff0000";  // red
  </script>
</body>
0 голосов
/ 22 февраля 2018

, если вы хотите использовать кнопку или другое событие, просто используйте это в JS:

document.querySelector("button").addEventListener("click", function() {
document.body.style.backgroundColor = "red";
});
0 голосов
/ 13 июня 2016

Это простое кодирование для изменения фона с использованием JavaScript

<body onLoad="document.bgColor='red'">
0 голосов
/ 22 января 2015

Я бы предложил следующий код:

<div id="example" onClick="colorize()">Click on this text to change the
background color</div>
<script type='text/javascript'>
function colorize() {
var element = document.getElementById("example");
element.style.backgroundColor='#800';
element.style.color='white';
element.style.textAlign='center';
}
</script>
0 голосов
/ 28 марта 2018

Вы можете изменить фон страницы, просто используя:

function changeBodyBg(color){
    document.body.style.background = color;
}

Подробнее @ Изменение цвета фона

0 голосов
/ 12 ноября 2018

В качестве альтернативы, если вы хотите указать значение цвета фона в записи rgb, попробуйте

document.getElementById("yourid").style.backgroundColor = 'rgb(' + a + ',' + b + ',' + c + ')';

где a, b, c - значения цвета

Пример:

document.getElementById("yourid").style.backgroundColor = 'rgb(224,224,224)';
0 голосов
/ 02 октября 2013

Но вы бы хотели настроить цвет тела до того, как элемент <body> существует. Таким образом, он имеет правильный цвет с самого начала.

<script>
    var myColor = "#AAAAAA";
    document.write('\
        <style>\
            body{\
                background-color: '+myColor+';\
            }\
        </style>\
    ');
</script>

Это вы можете поместить в <head> документа или в ваш файл js.

Вот хороший цвет для игры.

var myColor = '#'+(Math.random()*0xFFFFFF<<0).toString(16);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...