Как установить цвет фона CSS HTML с помощью JavaScript - PullRequest
Новая
       168

Как установить цвет фона CSS HTML с помощью JavaScript

96 голосов
/ 06 августа 2008

Как установить цвет фона CSS для элемента HTML с помощью JavaScript?

Ответы [ 16 ]

147 голосов
/ 06 августа 2008

Как правило, свойства CSS преобразуются в JavaScript, делая их camelCase без каких-либо черточек. Так что background-color становится backgroundColor. 

function setColor(element, color)
{
    element.style.backgroundColor = color;
}
28 голосов
/ 19 августа 2008

Вы можете найти, что ваш код более удобен в обслуживании, если вы храните все свои стили и т. Д. В CSS и просто устанавливаете / отменяете имена классов в JavaScript.

Ваш CSS, очевидно, будет выглядеть примерно так: 

.highlight {
    background:#ff00aa;
}

Тогда в JavaScript: 

element.className = element.className === 'highlight' ? '' : 'highlight';
23 голосов
/ 06 августа 2008 
var element = document.getElementById('element');
element.style.background = '#FF00AA';
20 голосов
/ 06 августа 2008

Или, используя маленький jQuery: 

$('#fieldID').css('background-color', '#FF6600');
7 голосов
/ 04 марта 2011

Добавьте этот элемент скрипта в ваш элемент body: 

<body>
  <script type="text/javascript">
     document.body.style.backgroundColor = "#AAAAAA";
  </script>
</body>
6 голосов
/ 17 апреля 2015 

var element = document.getElementById('element');

element.onclick = function() {
  element.classList.add('backGroundColor');
  
  setTimeout(function() {
    element.classList.remove('backGroundColor');
  }, 2000);
};
.backGroundColor {
    background-color: green;
}
<div id="element">Click Me</div>
4 голосов
/ 03 сентября 2015

Вы можете попробовать это 

var element = document.getElementById('element_id');
element.style.backgroundColor = "color or color_code";

Пример. 

var element = document.getElementById('firstname');
element.style.backgroundColor = "green";//Or #ff55ff

JSFIDDLE

4 голосов
/ 10 февраля 2014

Вы можете сделать это с JQuery: 

$(".class").css("background","yellow");
3 голосов
/ 23 июня 2017 
$('#ID / .Class').css('background-color', '#FF6600');

Используя jquery, мы можем указать класс или идентификатор элемента, чтобы применить фон CSS или любые другие стили

3 голосов
/ 05 января 2014

Вы можете использовать: 

  <script type="text/javascript">
     Window.body.style.backgroundColor = "#5a5a5a";
  </script>
Страница:
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...