Почему цвет у всех одинаковый?

#jquery #css

$(function (){
	$('div').css('background', $('div').html());
});
div {
  margin: 10px;
  width: 50px;
  text-align: center;
  color: white;
}

red
yellow
blue
green
black




Почему у всех красный цвет а не разный?
    

Ответы

Ответ 1

each() - не обязателен.

.css() - вторым параметром может принимать функцию, которая возвращает, что угодно.
В данном случае можно вернуть свой же html (http://api.jquery.com/css/#css-propertyName-function)



$(function (){
    $('div').css('background', function(){ return $(this).html(); });
});
div {
  margin: 10px;
  width: 50px;
  text-align: center;
  color: white;
}

red
yellow
blue
green
black


Ответ 2

Потому что он берет текст первого попавшегося элемента div :) и он красный, делай так:



$(function() {
  $('div').each(function() {
    $(this).css('background', $(this).html());
  })

});
div {
  margin: 10px;
  width: 50px;
  text-align: center;
  color: white;
}

red
yellow
blue
green
black




Здесь ты получаешь все элементы div и проходишь по ним по очереди функцией each(),
$(this) это конкретно текущий элемент, и ему присваиваешь background равный содержимому
текущего элемента div.