jQuery-如何使用Prop方法更改背景色

Question

我可以使用Prop方法更改背景色属性值吗？我是编程的新手。：）

这就是我所拥有的，

$('ul').prop('backgroundColor','red');

我阅读了我正在阅读的这本书的章节，这是我的理解，我可以使用jQuery中的道具方法从DOM更改属性。我可以更改其他域属性，例如className。为什么不背景彩色？写这本书，我也尝试了Atr。

$('ul').attr('background-color','red');

在这种情况下，attr可以访问CSS属性，对吗？但是，当使用Prop方法时，我们确实可以访问某些CSS属性吗？为什么会创建背景彩色？

我知道更改背景颜色的最佳方法是在jQuery中使用CSS方法。我只是想知道道具或ATR方法是否可以更改背景颜色，为什么不（如果没有）。我相信这将使我对DOM有更好的了解。

谢谢！

Answer 1

您需要使用.css()来操纵CSS属性。

$('ul').css('background-color','red');

Answer 2

backgroundColor是元素的 style属性的嵌套属性，因此.prop('backgroundColor','red');在这里无法使用。

相反，您可以通过获取DOM元素来设置属性。如果有多个元素，那么您需要迭代它们。

$('div')[0].style.backgroundColor = 'red';
// if there is multiple elements
$('div').each(function() {
  this.style.backgroundColor = 'red';
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>a</div>

---

或使用css()方法设置任何样式属性。

$('div').css('backgroundColor', 'red');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>a</div>

Answer 3

    $('ul').attr('background-color','red');

不起作用，因为属性是"样式"，而背景色则是其中的属性。

您需要使用：

     $('ul')[0].style.backgroundColor = 'red';

Answer 4

编码直接html时，您可以指定这样的内联CSS：

<div style="background-color:#00000"></div>

因此，使用jQuery，您可以使用attr方法来利用此功能。

$('div').attr('style','background-color:#00000;');

因此，在某种程度上，是的，您可以使用atter方法更改CSS。因为HTML中的样式（CSS）有一个"属性"，并且更改HTML属性基本上是Attr的目的。